如何用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
今天就到这了,下课
浙公网安备 33010602011771号