使用jquery使用JSON数据重新填充表单
我有一个HTML表单，我通过ajax保存到数据库。 要获取键/值对的查询字符串，我使用了非常方便的serialize函数，如下所示：
var myData = $("form#form_id").serialize(); $.ajax({ url: "my_save_script.php", type: "post", data: myData, success: function(msg){ alert(msg); } });
现在我想加载一个空白表单，并使用数据库中的数据重新填充它，该数据从ajax调用作为JSON字符串传递。 我已经能够获得具有正确键/值对的Javascript对象，如下所示：
data = $.parseJSON(data); data = data[0];
重新填充表单最简单，最优雅的方法是什么？
请记住，表单的输入元素是文本，选择，复选框和广播。 输入元素的名称与数据库列的名称相同，并且是上述data对象中键/值对的键。 这就是为什么serializefunction对我来说非常好
我想说最简单的方法就是这样：
// reset form values from json object $.each(data, function(name, val){ var $el = $('[name="'+name+'"]'), type = $el.attr('type'); switch(type){ case 'checkbox': $el.attr('checked', 'checked'); break; case 'radio': $el.filter('[value="'+val+'"]').attr('checked', 'checked'); break; default: $el.val(val); } });
基本上，唯一奇怪的是复选框和无线电，因为他们需要检查他们的已检查属性。 无线电比复选框稍微复杂一些，因为我们不仅需要检查它们，还需要找到正确的ONE来检查（使用该值）。 其他所有内容（输入，textareas，选择框等）应该将其值设置为JSON对象中返回的值。
jsfiddle： http ： //jsfiddle.net/2xdkt/
如果data [0]包含字段的名称，而data [1]包含该值，则可以执行以下操作：
您可以为文本框执行以下操作：
$("[name="+data[0]+"]").val(data[1]);
然后选择这样的东西：
$("[name="+data[0]+"]").val(data[1]);
请注意，复选框和单选按钮仅在选中后才会序列化。
所以这样的复选框（在jQuery 1.6+之前）：
$("[name="+data[0]+"]").attr('checked','checked');
单选按钮可能需要一些额外的工作，具体取决于您如何区分不同的工作。 （IE Id，值等..）
我建议你改变你提出ajax请求的方式。 使用.post（）
$.post("my_save_script.php", { data: myData, }, function(data) { $.each(data, function(i, item){ $("#"+item.field).val(item.value); }); }, "json");