后台返回json 前台Ajax循环遍历显示到table

后台

public ActionResult List()
{

//list集合

 

var a = bll.getUserList();

//注意这里的a是要返回的json

return Json(a,JsonRequestBehavior.AllowGet);
}

前台ajax接受json

$.ajax({
url: "/User/Index",
type: "get",
dataType: "json",
success: function (a) {
var tab = $("#tabjson");
$.each(a, function (name, val) {
tab.append("<tr>");

//方法一
//$("<td>" + val.userID + "</td>").appendTo($("#tabjson"))
//$("<td>" + val.UserName + "</td>").appendTo($("#tabjson"))

//方法二和方法一差不多(可以熟悉下append和appendTo的区别)

//$("#tabjson").append("<td>" + val.userID + "</td>");
//$("#tabjson").append("<td>" + val.UserName + "</td>");
//tab.append("</tr>");

//方法三   推荐使用这种方法 将item追加到table
item = "<tr><td>" + val['userID'] + "</td><td>" + val['UserName'] + "</td><td>" + val['password'] + "</td></tr>";

$('#tabjson').append(item);

});

});

 

//table显示

<table id="tabjson">
<tbody >
<tr>
<th>序号</th>
<th>用户名</th>
</tr>
</tbody>

</table>

 

转载于:https://www.cnblogs.com/xiongyingaoxiang/p/10698868.html