title: jQuery: Set form input value to json data
body: <p>I am trying to insert an instance ID which I am receiving via JSON into a form input.</p>
  
  <pre><code>function assignCategoryValue()
  {
      var userInput = $("#input_transaction_category").val();
      var formOptions = document.getElementById("id_transaction_category").options;
  
      for(var i=1;i&lt;formOptions.length;i++)
      {
          if(formOptions[i].text == userInput)
          {
              // This works.
              $("#id_transaction_category").val(formOptions[i].value);
              console.log(formOptions[i].value);
              return false;
          }
      }
  
      alert("Doesn't exist, creating.");
      $.ajaxSetup({async: false});
      var postdata = { 'csrfmiddlewaretoken': '{{ csrf_token }}' }
      $.post("create_category/"+userInput+'/', postdata, function( data ){
        for(var key in data)
        if (data.hasOwnProperty(key))
          var foo = data[key];
          // The console prints out the value I want.
          console.log(foo);
          $("#id_transaction_category").val(foo);
          // Yet after I set the value, the console prints a blank line.
          console.log($("#id_transaction_category").val()); 
          return false;
      });
  }
  </code></pre>
  
  <p>According to the console the JSON has the value I want but I am having troubles inserting it into my form.</p>
  
  <p>The JSON which is sent by the $.post is like this:</p>
  
  <pre><code>data = json.dumps({"category_id" : category_id})
  print data
  
  {"category_id": 178} // from server console
  </code></pre>
  
  <p>The JSON which is received by the $.post is like this:</p>
  
  <pre><code>$.post("create_category/"+userInput+'/', postdata, function( data ){
  console.log(data);
  Object {category_id: 180} // From crhome console
  
  var foo = data[key];
  console.log(foo);
  180 // From chrome console
  </code></pre>
  
  <p>The input I am trying to fill:</p>
  
  <pre><code>&lt;select id="id_transaction_category" name="transaction_category"&gt;
    &lt;option value="" selected="selected"&gt;---------&lt;/option&gt;
    &lt;option value="1"&gt;Travel&lt;/option&gt;
    &lt;option value="2"&gt;New&lt;/option&gt;
    &lt;option value="3"&gt;test&lt;/option&gt;
    .
    .
    .
    &lt;option value="191"&gt;nfaha&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>