Answers.Body: <p>Looks like you're actually off-track in a couple of different ways...</p>
  <h3>ElementCriteriaModel</h3>
  <p>This code is going to return an <a href="http://buildwithcraft.com/docs/templating/elementcriteriamodel" rel="nofollow noreferrer">ElementCriteriaModel</a>:</p>
  <pre><code>craft.tags.group('gameTags')
  </code></pre>
  <p>Think of an ElementCriteriaModel as being a <em>pending search query</em>... The only reason you'd need one is to either <strong>adjust the query further</strong> or <strong>run the query to get results</strong>.</p>
  <p>Fortunately Craft is smart enough to automatically run an ElementCriteriaModel if you use it an another context. In fact, it will be automatically parsed as <strong>an array of the query results</strong>. When you let the query run automatically, it's as if you had appended <code>.find</code> to the original line of code. If you append something like <code>.first</code> to your code, it'll return only a single element.</p>
  <p>See <a href="http://buildwithcraft.com/docs/templating/elementcriteriamodel#fetching-the-elements" rel="nofollow noreferrer">&quot;Fetching the Elements&quot;</a> for more details.</p>
  <h3>JavaScript</h3>
  <p>As André pointed out in <a href="https://craftcms.stackexchange.com/a/10950/45">his answer</a>, you'd want to wrap a string in quotes when passing it to JavaScript.</p>
  <p>However, it looks like you're returning an array. So you'd probably need to manipulate that array however you'd like in Twig, before passing it to JavaScript as either a string or an array.</p>
  <pre class="lang-js prettyprint-override"><code>// Setting a string
  var gameTags = &quot;{{ myString }}&quot;;
  
  // Setting an array
  var gameTags = [&quot;{{ myArray | join('&quot;,&quot;') }}&quot;];
  </code></pre>
  <p>This operates under the assumption that <code>myArray</code> is already an array of strings. But be careful... When you run your ElementCriteriaModel, you'll end up with an array of <a href="http://buildwithcraft.com/docs/templating/tagmodel" rel="nofollow noreferrer"><strong>TagModels</strong></a>. You may need to extract the <code>title</code> of each TagModel before throwing them to JavaScript.</p>
  <p>Take note also of the Twig <a href="http://twig.sensiolabs.org/doc/filters/join.html" rel="nofollow noreferrer"><code>join</code></a> filter. That will combine your array of strings into a &quot;superstring&quot;, which you can pass to JavaScript to build your JS array.</p>
  <p>Hope that helps!</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-14T17:23:53.410Z
Answers.Text: Ah, quotation marks! I've got it working now - thanks so much!
Answers.UserDisplayName: Andrea Hall
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-12T21:29:25.660Z
Answers.LastActivityDate: 2015-08-12T21:29:25.660Z
Answers.LastEditDate: 2020-06-17T08:56:27.903Z
Answers.UserDisplayName: Lindsey D
Answers.Body: <p>In your first example, you are outputting an <code>ElementCriteriaModel</code>. That is a query for tags rather than the tags themselves. It doesn't output anything usable by JS You're almost doing the same in the second example, except that your reference to <code>gameTags</code> in the JS is just referencing itself rather than any Twig output.</p>
  
  <p>What you want to do is to query the tags and output in the way that JS can use. Something like this:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      var gameTags = [{% for tag in craft.tags.group('gameTags') %}"{{ tag.title }}",{%endfor %}];
  &lt;/script&gt;
  </code></pre>
  
  <p>That should output a JS array of strings with each string being a tag. Something like below.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      var gameTags = ["action","adventure","platform","rpg","sports",];
  &lt;/script&gt;
  </code></pre>
  
  <p>If you're a stickler for commas in arrays, there's ways to not output that after the last tag.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-12T21:27:10.100Z
Answers.LastActivityDate: 2015-08-12T21:27:10.100Z
Answers.UserDisplayName: Bryan Redeagle
Answers.Body: <p>You probably just need to wrap the twig output in a string, if that's what you need in your javascript. Try:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    var gameTags = "{{ craft.tags.group('gameTags') }}";
  &lt;/script&gt;
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-12T21:13:52.447Z
Answers.LastActivityDate: 2015-08-12T21:13:52.447Z
Answers.UserDisplayName: André Elvan
Body: <p>This came out of a <a href="https://craftcms.stackexchange.com/questions/10707/can-you-pass-a-variable-with-includejsfile">previous question</a></p>
  
  <p>I need to set a variable of a tag group that I can reference in jquery for use with a plugin.</p>
  
  <p>I'm declaring this variable in a  tag so my included js files can access it.</p>
  
  <p>Here's what I <em>want</em> to do:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      var gameTags = {{ craft.tags.group('gameTags') }};
  &lt;/script&gt;
  </code></pre>
  
  <p>Javascript clearly doesn't like that syntax, so I tried setting the variable with Twig and calling that:</p>
  
  <pre><code>{% set gameTags = craft.tags.group('gameTags') %}
  
  &lt;script type="text/javascript"&gt;
     var gameTags = gameTags;
  &lt;/script&gt;
  </code></pre>
  
  <p>JS considered that undefined.</p>
  
  <p>I'm probably going about this the wrong way. I'm relatively new to javascript and very new to craft, so I'm a little stumped.</p>
  
Tags: <variable><javascript><jquery>
Title: Can I set a JS variable to a Twig output tag?
ThreadText: # Can I set a JS variable to a Twig output tag?
  
  (Asked by: username_0 on 2015-08-12)
  
  This came out of a [previous question](https://craftcms.stackexchange.com/questions/10707/can-you-pass-a-variable-with-includejsfile)
  
  I need to set a variable of a tag group that I can reference in jquery for use with a plugin.
  
  I'm declaring this variable in a tag so my included js files can access it.
  
  Here's what I *want* to do:
  
  ```
  <script type="text/javascript">
      var gameTags = {{ craft.tags.group('gameTags') }};
  </script>
  
  ```
  
  Javascript clearly doesn't like that syntax, so I tried setting the variable with Twig and calling that:
  
  ```
  {% set gameTags = craft.tags.group('gameTags') %}
  
  <script type="text/javascript">
     var gameTags = gameTags;
  </script>
  
  ```
  
  JS considered that undefined.
  
  I'm probably going about this the wrong way. I'm relatively new to javascript and very new to craft, so I'm a little stumped.
  
  **Tags:** variable, javascript, jquery
  
  
  ---
  
  ## 3 answers
  
  ### Answer by username_1 on 2015-08-12. Score: 4 | Accepted answer
  
  Looks like you're actually off-track in a couple of different ways...
  
  ### ElementCriteriaModel
  
  This code is going to return an [ElementCriteriaModel](http://buildwithcraft.com/docs/templating/elementcriteriamodel):
  
  ```
  craft.tags.group('gameTags')
  
  ```
  
  Think of an ElementCriteriaModel as being a *pending search query*... The only reason you'd need one is to either **adjust the query further** or **run the query to get results**.
  
  Fortunately Craft is smart enough to automatically run an ElementCriteriaModel if you use it an another context. In fact, it will be automatically parsed as **an array of the query results**. When you let the query run automatically, it's as if you had appended `.find` to the original line of code. If you append something like `.first` to your code, it'll return only a single element.
  
  See ["Fetching the Elements"](http://buildwithcraft.com/docs/templating/elementcriteriamodel#fetching-the-elements) for more details.
  
  ### JavaScript
  
  As username_3 pointed out in [his answer](https://craftcms.stackexchange.com/a/10950/45), you'd want to wrap a string in quotes when passing it to JavaScript.
  
  However, it looks like you're returning an array. So you'd probably need to manipulate that array however you'd like in Twig, before passing it to JavaScript as either a string or an array.
  
  ```js
  // Setting a string
  var gameTags = "{{ myString }}";
  
  // Setting an array
  var gameTags = ["{{ myArray | join('","') }}"];
  
  ```
  
  This operates under the assumption that `myArray` is already an array of strings. But be careful... When you run your ElementCriteriaModel, you'll end up with an array of [**TagModels**](http://buildwithcraft.com/docs/templating/tagmodel). You may need to extract the `title` of each TagModel before throwing them to JavaScript.
  
  Take note also of the Twig [`join`](http://twig.sensiolabs.org/doc/filters/join.html) filter. That will combine your array of strings into a "superstring", which you can pass to JavaScript to build your JS array.
  
  Hope that helps!
  
  > **Comments:**
  > **username_0**: Ah, quotation marks! I've got it working now - thanks so much!  
  
  ---
  
  ### Answer by username_2 on 2015-08-12. Score: 4
  
  In your first example, you are outputting an `ElementCriteriaModel`. That is a query for tags rather than the tags themselves. It doesn't output anything usable by JS You're almost doing the same in the second example, except that your reference to `gameTags` in the JS is just referencing itself rather than any Twig output.
  
  What you want to do is to query the tags and output in the way that JS can use. Something like this:
  
  ```
  <script type="text/javascript">
      var gameTags = [{% for tag in craft.tags.group('gameTags') %}"{{ tag.title }}",{%endfor %}];
  </script>
  
  ```
  
  That should output a JS array of strings with each string being a tag. Something like below.
  
  ```
  <script type="text/javascript">
      var gameTags = ["action","adventure","platform","rpg","sports",];
  </script>
  
  ```
  
  If you're a stickler for commas in arrays, there's ways to not output that after the last tag.
  
  
  ---
  
  ### Answer by username_3 on 2015-08-12. Score: 1
  
  You probably just need to wrap the twig output in a string, if that's what you need in your javascript. Try:
  
  ```
  <script type="text/javascript">
    var gameTags = "{{ craft.tags.group('gameTags') }}";
  </script>
  
  ```
  
  
  ---
  
  