Jqgrid之非同步載入資料-yellowcong
阿新 • • 發佈:2019-02-02
JqGrid如果是傳送ajax請求,是阻塞式的,我們可以先將grid渲染出來,然後在裡面新增資料,通過非同步載入的方式,來渲染grid,主要用到的函式
$("#gridKeiTouData")[0].addJSONData(jsonData);
,設定在loadComplete 事件裡面,設定資料。
例子
下面就是一個grid,非同步載入資料,先渲染,後設定資料
$("#gbox_gridKeiTouData").remove();
$("#wfgm1080KeiTouData").append("<table id='gridKeiTouData'></table>" );
$('#gridKeiTouData').jqGrid({
data: dataList,
datatype:"local",
multiboxonly:true,
cellEdit:false,
cellsubmit:'clientArray',
colNames:colNames,
colModel:colModel,
width:gridWidth,
height:gridHeight,
scrollOffset:0,
rowNum:dataList.length,
gridview: true ,
regional:'ja',
beforeSelectRow: function(rowid, event){
},loadComplete(xhr){
//表格渲染出來後,在設定資料
var jsonData = getGridData();
$("#gridKeiTouData")[0].addJSONData(jsonData);
}
});
//--------------------------------------------------------------------------------------
//資料獲取
//--------------------------------------------------------------------------------------
function getGridData(){
var url = "/test//getGrid.do";
var data = [];
var ajaxParam ={
"value(No)" : $("#No").val()
};
$.ajaxSettings.async = false;
$.getJSON(
url,
ajaxParam,
function(result,e) {
if(result.error){
sofia.ui.showDialogJsMsg(result.type, result.text);
}else{
data = result.resultList;
}
});
return data;
}