EasyUI的datagrid數據表格用法

這是官方文檔
引入easyui所有相關的js、css文件，然後寫一個表格：

<table id="alldg" style="min-height:400px;width:100%;"></table>

var obj = {name: '小王', sex: 'man'};       //  要傳的參數

$('#alldg').datagrid({
   url: "/xxxx/yy,          //  請求接口
    columns: [[     //  列名數組
        {field: 'name', title: '名稱', width: '51%', align: "center"},
        {field: 'area', title: '區域', width: '50%', align: "center"},
    ]],
    onLoadSuccess: function (data) {
       //  加載成功後所做的操作
    },
    onBeforeLoad: function (param) {
     	console.log(param)    //  這是發送請求前你傳的所有參數，其中包含默認參數page:當前頁碼，rows:每頁條數
    },
    onLoadError: function () {
        console.log("數據加載失敗！")
    },
    queryParams: obj,     //  當請求遠程數據時，發送的額外參數
    pagination: true,        // 是否顯示分頁
    pagePosition: "bottom",     // 分頁器位置
    pageNumber: 1,     //  當前頁碼
    pageSize: 12,        // 每頁條數
    singleSelect: true,    // 每次只能選中一條數據
    pageList: [12, 24, 48, 96],        // 可選每頁條數數組
    loadFilter: function (data) {       // 返回要顯示的過濾數據。該函數有一個參數 'data' ，表示原始數據。您可以把原始數據變成標準數據格式。該函數必須返回標準數據對象，含有 'total' 和 'rows' 屬性。
		var temp=data.rows;
	    for (var i=0;i<temp.length;i++){     //  遍歷返回數據，將需要改變的顯示字段進行修改
	        if(temp[i].status==1){
	            data.rows[i].status = "啓用"
	        }else if(temp[i].status==0){
	            data.rows[i].status = "禁用"
	        };
	     }
	     return data;
	},          
});

至此就能成功渲染出了數據表格，馬賽克打的有點多，湊合看吧：