1. 程式人生 > >簡單總結easyUI中datagrid的用法

簡單總結easyUI中datagrid的用法

      easyUI的datagrid封裝的挺好用的。我在使用datagrid時候,感覺比較困難的是關於它的分頁。這個分頁,我在專案中是結合nutz來做的。在後臺實現分頁,前臺展示。下面詳細說一下。

    用到datagrid,最高效的方法就是找到合適的demo,複製貼上。然後對著easyUI的api選擇性的挑出來放到js檔案中,可以讓前端頁面更加簡潔。datagrid有欄位名,叫columns。

url:  這個是資料來源,可以寫一個servlet的檔名。不需要加字尾。servlet輸出的格式為json格式。

queryParams.用來在接收遠端資料的時候,接收額外的引數。  

                    var queryParams=$("#dictionary").datagrid('options').queryParams;
                    queryParams.id=node.id;
loadFilter.在實現點選樹表,觸發datagrid重新載入就是依靠這個方法和queryParams。loadfilter方法返回的資料為data。有一個要求,就是data必須包含rows和total,它們有利於後臺接收分頁需要的引數。所以,當傳輸給datagrid的json資料沒有total和rows時候,需要搭設rows,total格式的json資料返回。
$('#dictionary').datagrid({
    	 loadFilter: function(data){
    		 if(data == -1){
         		alert("資料傳輸出錯");
         	}else{
         		data:{
                  total:  ,
                  rows:data
                }
         		return data;
         	}
    		},
它相當於datagrid的一個數據過濾器。而queryParams則是附帶傳進資料來源url的資料。