如何用jQuery做一个表格组件
同事问我如何用jquery做一个表格控件,他百度到一个用html制作表格,用jquery操作的表格并不是很好的方案,
给他做个了演示Demo
html:
<div id="grid"></div>
js:
$("#grid").datagrid({ width: 600, height: 400, columns: [ { text: "名称", field: "name", width: 200 }, { text: "年龄", field: "age" }, { text: "日期", field: "birthday", renderer: function (value, row, col) { if (value && value.getFullYear) { value = value.getFullYear() + "-" + (value.getMonth() + 1) + "-" + value.getDate(); } return value; } } ], data: [ { name: "name1", age: 20, birthday: new Date() }, { name: "name1", age: 20, birthday: new Date() }, { name: "name1", age: 20, birthday: new Date() }, { name: "name1", age: 20, birthday: new Date() }, { name: "name1", age: 20, birthday: new Date() } ] }); function addRow() { var grid = $("#grid").data("datagrid"); grid.addRow({ name: "bbb" }); } function setColumns() { var grid = $("#grid").data("datagrid"); grid.setColumns([ { text: "Name", field: "name", width: 150 }, { text: "Age", field: "age", width: 150 } ]); }
demo例子:
https://files.cnblogs.com/files/romayn/jqeury.zip
今天就到这了,下课