jQuery how to load some json records into a form fields?

Question

i have a json file:

 {
    \"data\": \"Click\",
    \"size\": \"Here\"    }

and a form:

First name: 

        

Answer 1

You may also use $.get like below;

$.get('your_file.[php/json]',function(d){
    $("input[name='firstname']").val(d.data);
    $("input[name='firstname']").val(d.size);
},'json');

Answer 2

Could you take a look at the JQuery loadJSON plugin on the http://code.google.com/p/jquery-load-json/ ? On the page http://code.google.com/p/jquery-load-json/wiki/WorkingWithFormElements is explained how this plugin load JSON object into the form. You can also find one live example here http://jquery-load-json.googlecode.com/svn/trunk/edit.html?ID=17. I think that this is exactly what you need. Just create empty form and load json in the form using the following code:

$('form').loadJSON(data);

This plugin handles all form elements such as check boxes, select list radio buttons etc. If you use it you will need to download plugin from the http://code.google.com/p/jquery-load-json/source/browse/trunk/scripts/jquery.loadJSON.js.

Answer 3

Or if your data return was fieldname value pairs like:

{"firstname" : "John", "lastname" : "Doe"}

you could do it like:

$.getJSON('url_to_file', function(data) {
    for (var i in data) {
        $('input[name="'+i+'"]').val(data[i]);
    }
});

Answer 4

So, what's wrong with $.getJSON? It works fine:

$.getJSON("1.json", function(data) {
  $('input[name="firstname"]').val(data["data"]);
  $('input[name="lastname"]').val(data["size"]);
});