[英]Populating input field with JSON data
我已经从服务器收到一个JSON对象,我希望它遍历所有返回的值并填充两个动态创建的输入文本字段。
目前,我有2条记录返回,但它仅填充一组字段,而另一组填充,尽管创建的字段仍未填充。 console.log
输出显示有两条记录:
0 Object {emailAdd: "bob@work.com", emailDesc: "work"}
1 Object {emailAdd: "john@home.com", emailDesc: "home"}
这是Jquery:
var emails = {% raw json_encode(emails) %};
$.each(emails, function(k,v) {
x = 1;
z = x++;
$('<input type="email" placeholder="Email" value="" id="email'+x+'" data-name="emailAdd" /><input type="text" placeholder="Description" value="" id="email'+z+'" data-name="emailDesc"/>').appendTo('#email');
$('#email' + x + '').val(v.emailAdd);
$('#email' + z + '').val(v.emailDesc);
x++;
console.log(k, v);
});
它似乎只是返回最后一条记录,而不是所有记录。 如何显示所有返回的记录?
要初始化变种x
在每次each
迭代。 您可以尝试以下方法:
var emails = {% raw json_encode(emails) %};
x=1;
$.each(emails, function(k,v) {
z=x++;
$('<div class="form-group1" name ="email" id="email"><input type="email" class="form-control" placeholder="Email" value="" id="email'+x+'" data-name="emailAdd" /><br><input type="text" class="form-control" placeholder="Description" value="" id="email'+z+'" data-name="emailDesc"/></div>').appendTo('#email');
$('#email'+x+'').val(v.emailAdd);
$('#email'+z+'').val(v.emailDesc);
x++;
console.log(k,v);
});
演示小提琴: http : //jsfiddle.net/orooct3q/
尝试这个
emails = JSON.parse('{% raw json_encode(emails) %}'); // or use $.parseJSON()
$.each(emails, function(k,v) {
// code goes here
console.log(k,v);
});
由于您在每个循环中开始计数x=1
,因此您的代码将覆盖以前的值。 以下应显示所有数据:
var emails = {% raw json_encode(emails) %};
$.each(emails, function(k,v) {
$('<div class="form-group1" name ="email" id="email"><input type="email" class="form-control" placeholder="Email" value="" id="email' + k + '-0" data-name="emailAdd" /><br><input type="text" class="form-control" placeholder="Description" value="" id="email' + z + '-1" data-name="emailDesc"/></div>').appendTo('#email');
$('#email'+k+'-0').val(v.emailAdd);
$('#email'+k+'-1').val(v.emailDesc);
console.log(k,v);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.