使用MiniUI的表格,有时需要通过js动态添加到页面,代码如下:
<div id="gridField"><div>
<script>
init();
function init() {
//列数据
var cols = [
{type:"checkcolumn" },
{field:"loginname", width:120, headerAlign:"center", allowSort:true, header:"员工账号", editor: {type:"textbox", minValue:0, maxValue:200, value:25} },
{field:"age", width:100, headerAlign:"center", allowSort:true, header:"年龄", editor: {type:"spinner"} },
{field:"birthday", width:100, headerAlign:"center", dateFormat:"yyyy-MM-dd H:mm", allowSort:true, header:"生日", editor: {type:"datepicker"} },
{field:"remarks", width:120, headerAlign:"center", allowSort:true, header:"备注", editor: {type:"textarea"} },
{field:"country", type:"comboboxcolumn", width:100, headerAlign:"center", header:"国家", editor: {type:"combobox", url:"../data/countrys.txt"} },
{field:"married", trueValue:1, falseValue:0, type:"checkboxcolumn", width:60, headerAlign:"center", header:"婚否" }
]
//动态创建表格
var grid =new mini.DataGrid();
grid.set({
url:"",
style:"width:100%;height:100%;",
id:"datagrid",
columns: cols,
multiSelect:true,
allowResize:true,
allowCellEdit:true,
allowCellSelect:true,
cellEditAction:"cellclick",
allowRowSelect:true,
showPager:true,
editNextOnEnterKey:true,
editNextRowCell:true
});
grid.render(document.getElementById("gridField"));
var data = [{},{}];
grid.setData(data);
}
</script>
网友评论