Question

如何将此嵌套数组转换为漂亮的html列表？

<ul id="droppable">
    <li value="id">lastname firstname</li>
    <li value="id">lastname firstname</li>
</ul>

这个数组就是我从ajaxrequest中得到的：

[{
    "id": 87,
    "lastname": "BOUSSAUW",
    "firstname": "ANNEMIE"
}, {
    "id": 88,
    "lastname": "VEREENOOGHE",
    "firstname": "STEFAAN"
}, {
    "id": 89,
    "lastname": "VERHEYDEN",
    "firstname": "JOKE"
}]

我的ajax请求：

$.ajax({
    type: 'GET',
    url: 'PHPCalls.php?CallID=GetGroupMembersJSON',
    data: { GroupID : str },
    success: function(data){
        var html = '';
        $.each(data, function(i, obj) {
            html += '<li id="' + obj.id + '">' + obj.lastname + ' ' + obj.firstname + '</li>';
        });

        $('#droppable').html(html);
    }
});

编辑：ul-tag已经存在。不需要添加它，但我没有提到

我得到的结果是一长串清单：

<li id="undefined">
    undefined undefined
</li>

Answer 1

您必须解析JSON，然后遍历数组。

var json = '[{"id": 87,"lastname": "BOUSSAUW","firstname": "ANNEMIE"}, {"id": 88,"lastname": "VEREENOOGHE","firstname": "STEFAAN"}, {"id": 89,"lastname": "VERHEYDEN","firstname": "JOKE"}]';
var data = $.parseJSON(json);

$('#form').html('');

$.each(data, function(i, o) {
    $('#form').append('<li id="'+o.id+'">'+o.lastname+' '+o.firstname+'</li>');
});

http://jsfiddle.net/Recode/mDHfs/1/

使用.before后的jquery重置表单

1 个答案: