1. 程式人生 > >Jqgrid之非同步載入資料-yellowcong

Jqgrid之非同步載入資料-yellowcong

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; }