怎么把后台传过来的Json拼成table 用Jquery ajax() 10
3个回答
展开全部
页面上的表格定义:
<table id="tableId"></table>
js中的代码:
var $parent0 = $('#tableId);//获取页面上id为tableId的table对象
$parent0.append($("<tr><td>姓名</td><td>年龄</td></tr>"));//html字符外面的$()不能少,这是jquery的
var tableStr;//定义一个用来拼表格内容的字符串
$.post("/getJson.action", { //ajax请求,这个地址需要返回json数据(json字符串)
varName1:$('#varId1').val(),//传递参数
varName2:$('#varId2').val()
}, function (data, textStatus){//data就是返回的json数据,textStatus表示请求返回的状态
alert(data);//可以再此看看返回的全部json数据
$.each( data , function(i, item) {//这个data是个数组,
//数组里是包含了name和age属性的对象
alert(item['name']);//item就表面每个对象,用item['name']来获取对应属性的值
alert(item['age']);
//在each方法中循环地拼tr,td元素,也可以不拼单个,直接在each方法是append到table对象下
tableStr += "<tr><td>"+item['name']+"</td><td>"+item['age']+"</td</tr>";
});
$parent0.append($(tableStr));//将表格内容增加到表格里
});
<table id="tableId"></table>
js中的代码:
var $parent0 = $('#tableId);//获取页面上id为tableId的table对象
$parent0.append($("<tr><td>姓名</td><td>年龄</td></tr>"));//html字符外面的$()不能少,这是jquery的
var tableStr;//定义一个用来拼表格内容的字符串
$.post("/getJson.action", { //ajax请求,这个地址需要返回json数据(json字符串)
varName1:$('#varId1').val(),//传递参数
varName2:$('#varId2').val()
}, function (data, textStatus){//data就是返回的json数据,textStatus表示请求返回的状态
alert(data);//可以再此看看返回的全部json数据
$.each( data , function(i, item) {//这个data是个数组,
//数组里是包含了name和age属性的对象
alert(item['name']);//item就表面每个对象,用item['name']来获取对应属性的值
alert(item['age']);
//在each方法中循环地拼tr,td元素,也可以不拼单个,直接在each方法是append到table对象下
tableStr += "<tr><td>"+item['name']+"</td><td>"+item['age']+"</td</tr>";
});
$parent0.append($(tableStr));//将表格内容增加到表格里
});
展开全部
大概就是这样,解析json,将json拼装成table返回。
function SetSubTable() {
var obj = jQuery.parseJSON($("#SubJsonStrValue").val());
window.ALLPARAMTERS = obj;
var row_str = "";
var span_num = 1
for (var i = 0; i < obj.length; i++) {
if (obj[i].ParamNames.length > 0) {
row_str += '<tr><td rowspan="' + obj[i].ParamNames.length + '"><input type="checkbox" name="_'+obj[i].Id+'" />' + obj[i].Name + '</td>';
for (var j = 0; j < obj[i].ParamNames.length; j++) {
if (j != 0) {
row_str += "<tr>";
}
row_str += '<td><input type="checkbox" name="p_'+obj[i].ParamNames[j].Id+'_'+obj[i].Id+'" />' + obj[i].ParamNames[j].Name + '</td><td>';
for (var k = 0; k < obj[i].ParamNames[j].ListItems.length; k++) {
row_str += obj[i].ParamNames[j].ListItems[k].Name+"|";
}
row_str = row_str.substring(0, row_str.length - 2);
row_str += "</td><td>";
if (obj[i].ParamNames[j].CanMultiSelecte) {
row_str += "多选";
} else {
row_str += "单选";
}
row_str += "</td></tr>";
}
}
}
$("#sub_table_header").after(row_str);
}
function SetSubTable() {
var obj = jQuery.parseJSON($("#SubJsonStrValue").val());
window.ALLPARAMTERS = obj;
var row_str = "";
var span_num = 1
for (var i = 0; i < obj.length; i++) {
if (obj[i].ParamNames.length > 0) {
row_str += '<tr><td rowspan="' + obj[i].ParamNames.length + '"><input type="checkbox" name="_'+obj[i].Id+'" />' + obj[i].Name + '</td>';
for (var j = 0; j < obj[i].ParamNames.length; j++) {
if (j != 0) {
row_str += "<tr>";
}
row_str += '<td><input type="checkbox" name="p_'+obj[i].ParamNames[j].Id+'_'+obj[i].Id+'" />' + obj[i].ParamNames[j].Name + '</td><td>';
for (var k = 0; k < obj[i].ParamNames[j].ListItems.length; k++) {
row_str += obj[i].ParamNames[j].ListItems[k].Name+"|";
}
row_str = row_str.substring(0, row_str.length - 2);
row_str += "</td><td>";
if (obj[i].ParamNames[j].CanMultiSelecte) {
row_str += "多选";
} else {
row_str += "单选";
}
row_str += "</td></tr>";
}
}
}
$("#sub_table_header").after(row_str);
}
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
如果是用 Jquery 那么在success里面取到的 data 就已经是个json对象,
在后台代码中将表格信息封装成一个json返回到前台.
在前台 你可以直接从 success,的参数 中.data 取得后台传过来的对象.
若是数组, 则直接遍历获取值即可.
拼表格的问题, 参加前面2位就ok 了
在后台代码中将表格信息封装成一个json返回到前台.
在前台 你可以直接从 success,的参数 中.data 取得后台传过来的对象.
若是数组, 则直接遍历获取值即可.
拼表格的问题, 参加前面2位就ok 了
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询