jquery – 在HTML表格中显示JSON数据

我从服务器获取以下 JSON字符串作为响应
[{"city":"AMBALA","cStatus":"Y"},{"city":"ASANKHURD",{"city":"ASSANDH","cStatus":"Y"}]

这是我的Jquery代码

$('#search').click(function() {
    alert("submit handler has fired");
    $.ajax({
        type: 'POST',url: 'cityResults.htm',data: $('#cityDetails').serialize(),success: function(data){ 
            alert(data);    
        },error: function(jqXHR,textStatus,errorThrown){
            alert('error: ' + textStatus + ': ' + errorThrown);
        }
    });
    return false;//suppress natural form submission
});

该警报正确显示JSON字符串.现在我想把这个响应映射到我的表

我怎样才能做到这一点 ??

解决方法

尝试这个:

CSS:

.hidden{display:none;}

HTML:

<table id="table" class="hidden">
    <tr>
        <th>City</th>
        <th>Status</th>
    </tr>
</table>

JS:

$('#search').click(function() {
    $.ajax({
        type: 'POST',dataType:"json",//to parse string into JSON object,success: function(data){ 
            if(data){
                var len = data.length;
                var txt = "";
                if(len > 0){
                    for(var i=0;i<len;i++){
                        if(data[i].city && data[i].cStatus){
                            txt += "<tr><td>"+data[i].city+"</td><td>"+data[i].cStatus+"</td></tr>";
                        }
                    }
                    if(txt != ""){
                        $("#table").append(txt).removeClass("hidden");
                    }
                }
            }
        },errorThrown){
            alert('error: ' + textStatus + ': ' + errorThrown);
        }
    });
    return false;//suppress natural form submission
});

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: &lt;span id=&quot...
jQuery 添加水印 &lt;script src=&quot;../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...