title: Using Json in select option value - errors due to double quotes
body: <p>I have a ajax request which returns a list of options for a select form input.  I have a json for the value of each option to represent an address.  However the double quotes cause an issue and only the first <code>{</code> is returned to the back end.</p>
  
  <p>Looking at the value in chrome dev tools I can see that the value recognised by chrome is the first <code>{</code> and not the whole json.  How can I get the value of a select to correctly hold a json value.</p>
  
  <p>The option value that appears in the browser is:</p>
  
  <pre><code>&lt;option value="{" dept":="" "",="" "orgn":="" "pobx":="" "subb":="" "bnam":="" "aspen",="" "bnum":="" "dpth":="" "thor":="" "knoll="" road",="" "ddlo":="" "dplo":="" "town":="" "",="" "cnty":="" "surrey",="" "pcod":="" "gu9="" 2XZ",="" "ppco":="" "tpco":="" 2ep"}"=""&gt;ASPEN&lt;/option&gt;
  </code></pre>
  
  <p>The ajax event is:</p>
  
  <pre><code>$(document).ready(function () {
    $('#id_previous2_postcode').change(function () {
      var postcode2 = $(this).val()
      console.log(postcode2)
      $.ajax({
        url: '/users/prior_addresses_ajax/',
        data: {
          'postcode': postcode2
        },
        dataType: 'json',
        success: function (data) {
          options = data.property_choices.map(function (subarray) {
            return '&lt;option value="' + subarray[0] + '"&gt;' + subarray[1] + '&lt;/option&gt;'
          })
          $('#id_previous2_full_address').html(options)
        }
      })
    })
  })
  </code></pre>