我的网格在firefox和chrome中工作正常，但当gridview设置为true时，它在IE9中显示“正在加载”图标。这是使用jqgrid 4.7.0
var setGrid = $("#recordSetsGrid");
var gridView=false; //setting this to true in IE9 causes grid not to show with only message 'Loading'.
setGrid.jqGrid(
{
ajaxGridOptions: {cache: false},
url : getUrlContext()+loadUrl,
postData : {
searchText : function() {
return $("#" + setSearchTextId)
.val();
}
},
datatype : "json",
editurl : setGrid_editUrl,
colNames : ["","Record Set", "Origin",
"Origin", "Organization",
"Sharing", "Active?",
"Comments" ],
editCaption : "Edit Record Set",
colModel : [
{
name : "crud",
width : 10,
fixed : true,
editable : false,
search : false
},
{
name : "recordSet",
width : 65,
fixed : true,
editable : false,
search : false
},
{
name : "origin",
width : 90,
editable : true,
hidden : true,
editrules : {
required : false,
edithidden : true
},
search : true,
editoptions : {
size : "30"
}
},
{
name : "domainName",
width : 90,
editable : false,
search : true,
searchoptions : {
caption : "Search in record sets",
sopt : [ 'cn' ]
},
formatter : originFormatter,
editrules : {
required : true,
edithidden : false
}
},
{
name : "org",
width : 80,
align : "left",
editable : true,
search : false,
formatter : orgFormatter,
editoptions : {
value : orgChoices
},
edittype : "select",
},
{
name : "sharing",
width : 65,
fixed : true,
align : "left",
editable : true,
search : false,
editoptions : {
value : sharingChoices
},
edittype : "select",
},
{
name : "active",
width : 45,
fixed : true,
align : "center",
editable : true,
search : false,
edittype : "checkbox",
editoptions:{value:"Yes:No", defaultValue: "Yes"}
},
{
name : "comments",
width : 80,
align : "left",
editable : true,
search : false,
editoptions : {
size : "60"
}
} ],
pager : "#recordSetsGridPager",
gridview: gridView,
rowNum : getRecordSetInitialPageSize(),
rowList : getRecordSetPageSizes(),
sortname : "origin",
sortorder : "desc",
viewrecords : true,
autoencode : true,
rownumbers: true,
height : 100,
width : 700,
multiselect : false,
caption : "Record Sets",
onSelectRow : function(ids)
{
var rowData = setGrid.jqGrid("getRowData",ids);
var origin=rowData["domainName"];
var caption="Resource Records: "+ origin;
if (ids == null) {
ids = 0;
if (jQuery("#recordsGrid").jqGrid('getGridParam','records') > 0) {
recGrid.jqGrid('setGridParam',{url:getUrlContext()+"" +
"/ZoneEditManaged.action?_eventName=getResourceRecords&isInit",page:1});
//recGrid.jqGrid('setCaption',caption).trigger('reloadGrid');
recGrid.trigger('reloadGrid');
}
} else {
recGrid.jqGrid('setGridParam',{url:getUrlContext()+
"/ZoneEditManaged.action?_eventName=getResourceRecords&&isInit=1",page:1});
//"/ZoneEditManaged.action?_eventName=getResourceRecords&&isInit=1&setId="+ids,page:1});
//recGrid.jqGrid('setCaption',caption).trigger('reloadGrid');
recGrid.trigger('reloadGrid');
}
$("#captionOriginId").html(origin);
//drawResourceRecordSearchBox(recGrid,caption);
},
ondblClickRow : function(rowid) {
var p = setGrid[0].p;
if (p.selrow !== rowid) {
grid.jqGrid('setSelection',
rowid);
}
setGrid.jqGrid('editGridRow',
rowid, editProps);
},
loadComplete : function() {
logMessage("In recordSetsGrid load complete");
applyContextMenu();
highlightFilteredData.call(this,setSearchTextId);
},
loadError : function(jqXHR, textStatus,
errorThrown) {
handleAjaxError(jqXHR, textStatus,
errorThrown);
}
}).navGrid('#recordSetsGridPager', {
add : true,
edit : true,
del : true,
search : false
}, editProps, addProps, delProps);
如果我更改gridView = false，它在IE9中运行良好。我将在此网格中有大量数据，因此我读到gridView = true可以加快大数据的性能。任何让gridView在IE9中工作的想法都很受欢迎。
由于
答案 0 :(得分：3)
在您对您的问题发表评论后，我理解了这个问题。问题的原因是jqGrid中的错误。它使用firstElementChild（请参阅the lines）属性：
} else {
//$("#"+$.jgrid.jqID(ts.p.id)+" tbody:first").append(rowData.join(''));
ts.firstElementChild.innerHTML += rowData.join(''); // append to innerHTML of tbody which contains the first row (.jqgfirstrow)
ts.grid.cols = ts.rows[0].cells; // update cached first row
}
我之前在jqGrid的my fork中修复了错误（请参阅当前的the lines）：
} else if (self.firstElementChild) {
self.firstElementChild.innerHTML += rowData.join(''); // append to innerHTML of tbody which contains the first row (.jqgfirstrow)
self.grid.cols = self.rows[0].cells; // update cached first row
} else {
// for IE8 for example
$tbody.html($tbody.html() + rowData.join('')); // append to innerHTML of tbody which contains the first row (.jqgfirstrow)
self.grid.cols = self.rows[0].cells; // update cached first row
}
因此，我建议您在jquery.jqGrid.src.js中进行相同的更改，或从my repository下载已修改的jquery.jqGrid.src.js，jquery.jqGrid.min.js和jquery.jqGrid.min.map个文件（请参阅{ {1}}文件夹）。我应该警告你，代码正在开发体育场，我打算在下个月发布第一个版本，但是当前代码是稳定的，它包含我发现的许多其他修复程序和一些新功能（稍后在自述文件中描述）
更新：解决问题的上述代码来自我的新代码，因此它包含上面定义的js和self我的代码。如果你想修改jqGrid 4.7的代码，你可以使用
$tbody更新2：免费jqGrid片段的当前代码如下所示
} else if (ts.firstElementChild) {
ts.firstElementChild.innerHTML += rowData.join('');
ts.grid.cols = ts.rows[0].cells;
} else {
// use for IE8 for example
var $tbody = $(ts.tBodies[0]);
$tbody.html($tbody.html() + rowData.join(''));
ts.grid.cols = ts.rows[0].cells;
}
答案 1 :(得分：3)
@Oleg的修改对我的类似问题有帮助，但我仍然在Internet Explorer 9中收到错误 此操作的无效目标元素 （7中没有问题） ，8,10或11）尝试这行代码时：
self.firstElementChild.innerHTML += rowData.join('');
但是，在设置了jqGrid属性...
之后gridview: false
...我不再在Internet Explorer 9中出现错误。据我所知，将gridview设置为true会立即构建表，从而提供更快的性能，而将gridview设置为false则逐行构建它并且速度稍慢。
我不知道jqGrid如何将表数据附加到innerHTML，因为来自MSDN：
innerHTML属性在col，colGroup，frameSet，html，head，style，table，tBody，tFoot，tHead，title和tr对象上是只读的。
然而，即使使用gridview：true，它在IE的所有版本中都适用于我，除了IE9。
这不是一个真正的答案，但希望它可以帮助某人。一如既往，感谢@Oleg对jqGrid的所有贡献。你比我想象的更能帮助我。
答案 2 :(得分：1)
我将'ts.firstElementChild'包装到$而不是'innerHTML'属性中。
try {
ts.firstElementChild.innerHTML += rowData.join(''); // append to innerHTML of tbody which contains the first row (.jqgfirstrow)
}
catch (e) {
//IE 9 bug-fix for exception "invalid target element for this operation"
$(ts.firstElementChild).html($(ts.firstElementChild).html() + rowData.join(''));
}
它正在发挥作用。
答案 3 :(得分：0)
@Oleg，我不得不对你的补丁进行一些更改，因为我在“自我”中收到了javascript错误。我想如果我使用完整的脚本，它会起作用我猜。这是我修改后的代码，如果看起来不正确，请告诉我。
} else if (ts.firstElementChild) { //Fix applied by Oleg for gridView=true in IE9.
ts.firstElementChild.innerHTML += rowData.join(''); // append to innerHTML of tbody which contains the first row (.jqgfirstrow)
ts.grid.cols = ts.rows[0].cells; // update cached first row
} else {
// for IE8 for example
$("#"+$.jgrid.jqID(ts.p.id)+" tbody:first").append($("#"+$.jgrid.jqID(ts.p.id)+" tbody:first").html() + rowData.join('')); //Modified
//$tbody.html($tbody.html() + rowData.join('')); // append to innerHTML of tbody which contains the first row (.jqgfirstrow) //doesn't work.
ts.grid.cols = ts.rows[0].cells; // update cached first row
}
现在正在运作。谢谢你的帮助。我明天会用你的分叉代码测试我的网格，让你知道结果。