title: Use jquery to re-populate form with JSON data
body: <p>I have an HTML form, that I save to the database via ajax.  To get the query string of key/value pairs, I have used the very convenient <code>serialize</code> function, like this:</p>
  
  <pre><code>var myData = $("form#form_id").serialize();
  $.ajax({
      url: "my_save_script.php",
      type: "post",
      data: myData,
      success: function(msg){
          alert(msg);
      }
  });
  </code></pre>
  
  <p>Now I want to load a blank form, and re-populate it with the data from the database, which is delivered from an ajax call as a JSON string.  I have been able to get a Javascript object with the correct key/value pairs like this:</p>
  
  <pre><code>data = $.parseJSON(data);
  data = data[0];
  </code></pre>
  
  <p>What is the simplest, most elegant way to re-populate the form?  </p>
  
  <p>keep in mind the input elements of the form are text, select, checkbox, and radio.  The names of the input elements are the same as the names of the database columns, and are the keys of the key/value pairs in the above <code>data</code> object.  This is why the <code>serialize</code> function works so well for me</p>