jquery怎么样动态的去组装一个table?

arthur.dy.lee 2016-01-06 11:48:42
jquery怎么样动态的去组装一个table?

1、只要定义一个grid的div

2、根据js中的变量columns,去读取并动态的去创建这个table?

问题:A,怎么去取得columns中的属性?对于定义的函数,应该怎么写回调? 能写些示例的代码吗?谢谢!!


<div class="grid-container" style="width: 950px;">
<div id="grid">
</div>
</div>
</div>

<script type="text/javascript">
var detailUrl = "http://localhost:8080/springmvc/formWidget/view";

var columns = [
{title: '单号', width: 100, dataIndex: 'orderId'},
{title: '子订单号', width: 120, dataIndex: 'subOrderId'},
{title: '收件人', width: 80, dataIndex: 'consignee'},
{title: '电话', width: 120, dataIndex: 'mobilePhone'},

{
title: '状态', width: 100, dataIndex: 'status',renderer: function (value, obj) {
var status = obj.status;
if('失败' == status){
return '<span style="color:red">'+status+'</span>';
}else{
return '<span>'+status+'</span>';
}
}
},
{
title: '操作', width: 100, dataIndex: 'operator', renderer: function (value, obj) {
var id = obj.orderId;
return '<span data-title="查看" data-href="' + detailUrl + '?orderId=' + orderId + '" data-id="' +
orderId + '" class="detail">查看</span>';
}
}
];
</script>
...全文
199 3 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
arthur.dy.lee 2016-01-11
  • 打赏
  • 举报
回复
引用 2 楼 SomethingJack 的回复:
为什么要这么麻烦 使用JQ的table组件不好么?你自己这么拼接 第一是麻烦 第二是后期修改也不好改呀
其实是想自己做个插件,jquery的table组件有许多,你推荐哪一款?
SomethingJack 2016-01-07
  • 打赏
  • 举报
回复
为什么要这么麻烦 使用JQ的table组件不好么?你自己这么拼接 第一是麻烦 第二是后期修改也不好改呀
arthur.dy.lee 2016-01-07
  • 打赏
  • 举报
回复
自己顶一下,可以动态的组装列头了,只是还不知道怎么去调用自定义的函数。 以下是组装的表头代码

var colArray = Array.prototype.slice.call(columns);
	buildTableTitle(colArray);

function buildTableTitle(colArray){
	var thead=[];
	thead.push("<thead id='columnTitles'><tr>");
	for(var i=0;i<colArray.length;i++){
		var col = colArray[i];
		thead.push("<th>" + col.title + "</th>");
	}
	thead.push("</tr></thead>");
	$("#retListTable").append(thead.join(""));
}


<table class="listTable" id = "retListTable" >
			            <tbody id = "retListBody" >  
			            </tbody>
				</table>

87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧