title: Can I pass a PHP Array as JSON encoded object as select field value and use with Javascript?
body: <p>I have a PHP function that returns database values to populate a select form field.  I am trying to populate the value of the option elements with all relevant data from the query (id, name, min, max) from the database so I don't have to send a AJAX request to get the rest, so I decided to json_encode the php array before populating select field.</p>
  
  <p>Relevant PHP:</p>
  
  <p><code>$items[] = array( "text" =&gt; $injury['name'], "value" =&gt; json_encode($injury) );</code></p>
  
  <p>HTML Output from PHP:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select name="input_2" id="input_2_2" class="medium gfield_select" tabindex="4"&gt;&lt;option value=" "&gt;Select an Injury&lt;/option&gt;&lt;option value="{&amp;quot;id&amp;quot;:&amp;quot;1&amp;quot;,&amp;quot;name&amp;quot;:&amp;quot;Arm&amp;quot;,&amp;quot;min&amp;quot;:&amp;quot;15000&amp;quot;,&amp;quot;max&amp;quot;:&amp;quot;25000&amp;quot;}"&gt;Arm&lt;/option&gt;&lt;option value="{&amp;quot;id&amp;quot;:&amp;quot;3&amp;quot;,&amp;quot;name&amp;quot;:&amp;quot;Head&amp;quot;,&amp;quot;min&amp;quot;:&amp;quot;100000&amp;quot;,&amp;quot;max&amp;quot;:&amp;quot;150000&amp;quot;}"&gt;Head&lt;/option&gt;&lt;option value="{&amp;quot;id&amp;quot;:&amp;quot;2&amp;quot;,&amp;quot;name&amp;quot;:&amp;quot;Leg&amp;quot;,&amp;quot;min&amp;quot;:&amp;quot;30000&amp;quot;,&amp;quot;max&amp;quot;:&amp;quot;45000&amp;quot;}"&gt;Leg&lt;/option&gt;&lt;/select&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>In the javascript side I am using jQuery to get the value of the option as below:</p>
  
  <pre><code>    `jQuery(injuryClass).on("change", function () {
          var injurySelect = jQuery(this);
          injury = injurySelect.val();
  
      var results = jQuery.parseJSON(jQuery(injury));
  console.log(results)
  </code></pre>
  
  <p>I get a console error: </p>
  
  <p><code>uncaught error: syntax error, unrecognized expression: {"id":"1","name":"Arm","min":"15000","max":"25000"}</code></p>