{ name: "PMOPerson",index: "PMOPerson",width: 250,editable: true,edittype: "select",editoptions: { dataUrl: "/Person/GetSelectData" },editrules: { required: false} },{ name: "HeaddisplayName",index: "HeaddisplayName",width: 150,editable: false },
当我通过调出编辑对话框来编辑一行时,需要10秒才能填充PMOPerson下拉列表.甚至在我之前已经加载过一次之后就是这种情况,我认为这是因为我在下面重新创建了一个形式：true
addButton({
caption: "",title: "Edit Selected Team",buttonicon: 'ui-icon-pencil',onClickButton: function () {
var id = $("#grid").getGridParam("selrow");
if (id) {
jQuery("#grid").jqgrid('editGridRow',id,{ url: '/OrganisationalUnit/Update',afterSubmit: function (response,postdata) {
var responseJson = $.parseJSON(response.responseText);
return HandleJqgridResponse(responseJson);
},height: 380,width: "auto",recreateForm: true,closeAfterEdit: true,cloSEOnescape: true,reloadAfterSubmit: true
});
}
},position: "second"
});
我试图找出是否有一种方法可以同时使用recreateform：true但仍然缓存dataUrl中的项目列表,以避免每次编辑行时都返回到服务器.
解决方法
我在the answer和前两个(this和this)中描述了如何在beforeProcessing回调中动态设置editoptions.value.需要扩展来自用于填充网格的服务器的响应以及其他信息(使用从editoptions.dataUrl返回的数据等数据).在我看来,它实现了editoptions.dataUrl数据缓存和重新加载网格刷新数据之间的最佳折衷.仍然可以在服务器端保存缓存的editoptions.dataUrl数据.
或者,可以使用更简单的方法,在创建网格后对createoptions.dataUrl进行一次手动Ajax请求,并且可以在Ajax请求的成功(完成)回调中设置editoptions.value.代码将涉及以下内容
// create grid
$("#grid").jqgrid({
colModel: [
{ name: "PMOPerson" },...
],...
});
// make separate asynchronous Ajax request to the server and set
// edittype: "select",editoptions: { value: ... }
setSelectOptionValues("/Person/GetSelectData",$("#grid"),"PMOPerson");
setSelectOptionValues的代码取决于您用来与URL进行通信的JSON数据的格式,如“/ Person / GetSelectData”.例如,如果服务器只返回字符串数组,则应该是< select>的文本和选项的值.然后可能是以下
var setSelectOptionValues = function (getJsonUrl,myGrid,colModelColumnName) {
$.getJSON(
getJsonUrl,function (data) {
var i,selectedOptions = '',datai,dn,colModelColumn;
for (i = 0; i < data.length; i += 1) {
if (i > 0) {
selectedOptions += ';';
}
else {
selectedOptions = "";
}
datai = data[i];
if (typeof datai === 'string') {
selectedOptions += datai;
selectedOptions += ':';
selectedOptions += datai;
}
}
myGrid.jqgrid("setColProp",colModelColumnName,{
edittype: "select",editoptions: { value: selectedOptions }
});
}
);
};
editoptions.value的设置将在setSelectOptionValues内异步完成.因此,可以在editoptions.value设置之前填充网格.另一方面,editoptions.value仅在编辑期间使用.来自“/ Person / GetSelectData”的响应时间通常足够快,并且在用户开始编辑之前将设置值editoptions.value.如果你想绝对确定你仍然可以举行editoptions.dataUrl.在editoptions.dataUrl的情况下,只有当用户快速作为响应“/ Person / GetSelectData”的服务器时才会使用.您可以更改显式调用
setSelectOptionValues("/Person/GetSelectData","PMOPerson");
使用getGridParam获取colModel,循环遍历所有colModel项,并为具有editoptions.dataUrl的所有项调用setSelectOptionValues.
最后一种方法的主要限制：你不能使用formatter：“select”(只是edittype：“select”).如果使用ids填充网格数据并且editoptions.value或formatoptions.value提供了id到文本的映射,那么我建议你使用beforeProcessing回调的第一种方法.