本文介绍了jqGrid行选择的怪异行为的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有这种非常不正常的行为，让我描述一下问题.
I have this very unusual behavior, Let me describe the problem.
jqgrid共有14条记录，起初将其设置为rowNum:10,，当我从下拉列表中选择显示50条记录时容纳所有记录，但是在Firefox 5中，当我选择第11行(名称为 asd )，它也会选择第10行.在IE8中，它的行为有所不同.
The jqgrid has 14 records all together, at first it is set to rowNum:10, when from the drop down I select to display 50 rows all the records accommodate, but in Firefox 5 when I select the 11th row (Name as asd) it selects the 10th row as well. It behaves differently in IE8.
在IE8中，它给了我以下错误
In IE8 it gives me the below error
Webpage error details
Message: 'className' is null or not an object
Line: 2496
Char: 4
Code: 0
URI: http://au1642163:10070/csm/view/include/js/jquery.jqGrid.min.js
这是IE8的图片
我的jqgrid代码
var xml=client.responseText;
var xmlDoc = $.parseXML(xml);
var $xml = $(xml);
xml=xml.replace(/<productId>1/g, "<productId>"+productMap['1']);
xml=xml.replace(/<productId>2/g, "<productId>"+productMap['2']);
$('#configDiv').empty();
$('#configDiv').html(
'<div id="configDetailsGrid" width="100%">' +
'<table id="list1" width="100%"></table><div id="gridpager"></div></div>');
var grid = jQuery("#list1");
var iconAlert;
getColumnIndexByName = function (grid, columnName) {
var cm = grid.jqGrid('getGridParam', 'colModel'), i = 0, l = cm.length;
for (; i < l; i += 1) {
if (cm[i].name === columnName) {
return i; // return the index
}
}
return -1;
},
grid = jQuery("#list1"),
iconAlert = '<span class="ui-state-error" style="border:0"><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span></span>';
grid.jqGrid({
datastr : xml,
datatype: 'xmlstring',
colNames:['cfgId','Name', 'Host','Operating System', 'Description','Product', 'Type', 'Last Updated Time','Last Updated By','',''],
colModel:[
{name:'cfgId',index:'cfgId', width:90, align:"left", hidden:true},
//{name:'updateDate',index:'updateDate', width:12, align:'center', formatter: oldConfigurationWarning },
{name:'cfgName',index:'cfgName', width:70, align:"left", formatter: 'showlink', formatoptions: {baseLinkUrl: '#'} },
{name:'hostname',index:'hostname', width:70, align:"left"},
{name:'osname',index:'osname', width:90, align:"left"},
{name:'cfgDesc',index:'cfgDesc', width:90, align:"left"},
{name:'productId',index:'productId', width:40, align:"left"},
{name:'cfgType',index:'cfgType', width:50, align:"left"},
{name:'updateDate',index:'updateDate',sorttype:'Date', width:120, align:"left"},
{name:'emailAddress',index:'emailAddress', width:120, align:"left"},
{name:'absolutePath',index:'absolutePath', width:90, align:"left", hidden:true},
{name:'fileName',index:'fileName', width:90, align:"left", hidden:true}
],
pager : '#gridpager',
rowNum:10,
rowList:[10,50,100],
scrollOffset:0,
height: 'auto',
emptyrecords: 'No configurations loaded',
autowidth:true,
viewrecords: true,
gridview: true,
multiselect: true,
xmlReader: {
root : "list",
row: "Response",
userdata: "userdata",
repeatitems: false
},
loadComplete: function () {
var count = grid.getGridParam();
var ts = grid[0];
if (ts.p.reccount === 0) {
grid.hide();
emptyMsgDiv.show();
} else {
grid.show();
emptyMsgDiv.hide();
}
//for showlink and icon alert having date difference more than 90 days
var iRow, row, trClasses, $cell,
icfgName = getColumnIndexByName(grid, 'cfgName'),
iupdateDate = getColumnIndexByName(grid, 'updateDate'),
mygrid = grid[0],
rows = mygrid.rows,
cRows = rows.length,
myLink = function (e) {
var $td = $(e.target).closest('td'),
text = $td.text(),
$tr = $td.closest('tr'),
rowid = $tr[0].id;
goToViewAllPage(rowid);
};
for (iRow = 0; iRow < cRows; iRow += 1) {
row = rows[iRow]; // row.id is the rowid
trClasses = row.className.split(' ');
if ($.inArray('jqgrow', trClasses) > 0) {
// the row is a standard row (only if subGrid:true are used)
/*if ($(row.cells[iupdateDate]).text() === 'Science') {
$cell.prepend(iconAlert);
}*/
var cellvalue1,firstDate,secondDate;
$cell = $(row.cells[icfgName]);
cellvalue1=$(row.cells[iupdateDate]).text();
firstDate = new Date();
//console.info(cellvalue1+", "+cellvalue1.length);
//var cellvalue1="08-18-2011 11:49:01";
if(cellvalue1.length>25)
{
secondDate=new Date();
//secondDate = secondDate.substring(0, secondDate.length-3);
if(diffOf2Dates(firstDate,secondDate,true)>=expireCondition)
{
$cell.prepend(iconAlert);
}
$cell.click(myLink);
}
else
{
secondDate = cellvalue1.substring(0, cellvalue1.length-6);
if(diffOf2Dates(firstDate,secondDate,false)>=expireCondition)
{
$cell.prepend(iconAlert);
}
$cell.click(myLink);
}
}
}
},
onSelectRow: function(id,status){
//var rowData = jQuery(this).getRowData(id);
}
});
grid.jqGrid('navGrid','#gridpager',{edit:false,add:false,del:false});
jQuery("#m1").click( function() {
var s;
s = grid.jqGrid('getGridParam','selarrrow');
alert(s);
});
var myGrid = $("#list1");
$("#cb_"+myGrid[0].id).hide();
// place div with empty message insde of bdiv
emptyMsgDiv.insertAfter(grid.parent());
}
};
我的XML响应
<list>
<Response>
<cfgId>704</cfgId>
<cfgName>IIR Windows1</cfgName>
<cfgDesc>asda</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientIIR.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientIIR.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IIR</hostname>
<createDate>2011-09-07 10:55:31.0 IST</createDate>
<updateDate>2011-09-07 10:55:31.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>717</cfgId>
<cfgName>ilmwin</cfgName>
<cfgDesc>asd</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientin164302.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientin164302.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IN164302</hostname>
<createDate>2011-09-07 16:45:03.0 IST</createDate>
<updateDate>2011-09-07 16:45:03.0 IST</updateDate>
<state>1</state>
<productId>2</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>718</cfgId>
<cfgName>ilmwin1</cfgName>
<cfgDesc>asdasd</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientin164302.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientin164302.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IN164302</hostname>
<createDate>2011-09-07 16:46:35.0 IST</createDate>
<updateDate>2011-09-08 10:19:26.0 IST</updateDate>
<state>2</state>
<productId>2</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>723</cfgId>
<cfgName>ilm linux</cfgName>
<cfgDesc>asd</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientestilo.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientestilo.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>estilo</hostname>
<createDate>2011-09-08 14:20:09.0 IST</createDate>
<updateDate>2011-09-08 14:20:09.0 IST</updateDate>
<state>1</state>
<productId>2</productId>
<osname>Linux</osname>
</Response>
<Response>
<cfgId>696</cfgId>
<cfgName>ILMwin1</cfgName>
<cfgDesc>asfas</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientin164302.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientin164302.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IN164302</hostname>
<createDate>2011-09-06 16:15:06.0 IST</createDate>
<updateDate>2011-09-06 16:15:06.0 IST</updateDate>
<state>1</state>
<productId>2</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>697</cfgId>
<cfgName>ILMlin</cfgName>
<cfgDesc>dgds</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientestilo.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientestilo.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>estilo</hostname>
<createDate>2011-09-06 16:20:58.0 IST</createDate>
<updateDate>2011-09-06 16:20:58.0 IST</updateDate>
<state>1</state>
<productId>2</productId>
<osname>Linux</osname>
</Response>
<Response>
<cfgId>706</cfgId>
<cfgName>ILM linux</cfgName>
<cfgDesc>wwrwrwr</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientestilo.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientestilo.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>estilo</hostname>
<createDate>2011-09-07 14:22:03.0 IST</createDate>
<updateDate>2011-09-07 14:22:03.0 IST</updateDate>
<state>1</state>
<productId>2</productId>
<osname>Linux</osname>
</Response>
<Response>
<cfgId>698</cfgId>
<cfgName>test1</cfgName>
<cfgDesc>asfta</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientgcslpar1.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientgcslpar1.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>gcslpar1</hostname>
<createDate>2011-09-06 17:14:31.0 IST</createDate>
<updateDate>2011-09-08 10:20:15.0 IST</updateDate>
<state>2</state>
<productId>1</productId>
<osname>AIX</osname>
</Response>
<Response>
<cfgId>699</cfgId>
<cfgName>test2</cfgName>
<cfgDesc>adAD</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientgcslpar2.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientgcslpar2.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>gcslpar2</hostname>
<createDate>2011-09-06 17:14:46.0 IST</createDate>
<updateDate>2011-09-06 17:14:46.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>AIX</osname>
</Response>
<Response>
<cfgId>702</cfgId>
<cfgName>IIR Windows</cfgName>
<cfgDesc>asdad</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientIIR.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientIIR.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IIR</hostname>
<createDate>2011-09-07 10:47:10.0 IST</createDate>
<updateDate>2011-09-07 10:47:10.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>687</cfgId>
<cfgName>asd</cfgName>
<cfgDesc>a</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientestilo.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientestilo.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>estilo</hostname>
<createDate>2011-09-06 13:28:28.0 IST</createDate>
<updateDate>2011-09-06 13:28:28.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>Linux</osname>
</Response>
<Response>
<cfgId>688</cfgId>
<cfgName>asd1</cfgName>
<cfgDesc>asd</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientbuckeye.ABC.com.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientbuckeye.ABC.com.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>buckeye.ABC.com</hostname>
<createDate>2011-09-06 13:30:10.0 IST</createDate>
<updateDate>2011-09-06 13:30:10.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>Linux</osname>
</Response>
<Response>
<cfgId>701</cfgId>
<cfgName>NULL</cfgName>
<cfgDesc>asda</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientin164302.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientin164302.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>IN164302</hostname>
<createDate>2011-09-07 10:43:19.0 IST</createDate>
<updateDate>2011-09-08 16:44:00.0 IST</updateDate>
<state>2</state>
<productId>2</productId>
<osname>Windows_NT</osname>
</Response>
<Response>
<cfgId>705</cfgId>
<cfgName>Sunos config</cfgName>
<cfgDesc>asdasd</cfgDesc>
<cfgType>Production</cfgType>
<fileName>csmclientzenvo.xml</fileName>
<absolutePath>../webapps/csm/files//12345/csmclientzenvo.xml</absolutePath>
<emailAddress>[email protected]</emailAddress>
<projectId>12345</projectId>
<hostname>zenvo</hostname>
<createDate>2011-09-07 11:22:56.0 IST</createDate>
<updateDate>2011-09-07 11:22:56.0 IST</updateDate>
<state>1</state>
<productId>1</productId>
<osname>SunOS</osname>
</Response>
</list>
推荐答案
您应该测试自己发布的代码.您应该仔细阅读.如果您不想遇到上述问题，则应以其他方式设置问题.不过，我会回答您当前的问题.
You should test yourself the code which you post. You should carefully read the question with the answer. If you don't want to have the described problems you should set your questions in another way. Nevertheless I will answer on your current question.
当前代码包含许多未定义的函数和变量.此外，它具有较小的语法错误.最重要的一个是
The current code contains many undefined functions and variabls. Moreover it has small syntax error. One from the most important is
var grid = jQuery("#list1");
var iconAlert;
getColumnIndexByName = function (grid, columnName) {
...
},
grid = jQuery("#list1"),
iconAlert = '<span class="ui-state-error" ...'
您不应定义相同的变量两次，因此sou应该以;"代替. var iconAlert;的逗号分隔以将变量getColumnIndexByName定义为函数.
You should not define the same variables twice and in any way sou should replace ';' at the ent of var iconAlert; to comma to define the variable getColumnIndexByName as a function.
开头的代码(xml=xml.replace(/<productId>1/g, "<productId>"+productMap['1']);)我根本听不懂.如果拥有$xml并且可以使用jQuery选择和修改任何XML元素，为什么需要对XML做为文本进行奇怪的修改.
The code at the beginning (xml=xml.replace(/<productId>1/g, "<productId>"+productMap['1']);) I can't understand at all. Why you need to do strange modifications of XML as text if you has $xml and can use jQuery to select and modify any XML element.
如果您继续使用肮脏的代码，则可能会遇到更严重的问题.我建议您始终在 JSLint 中验证您的代码.您可以包含例如JSLint选项
If you would continue to use so dirty code you can has more serious problems. I recommend you always verify your code in JSLint. You can include JSLint options for example
/*global $, jQuery */
/*jslint devel: true, browser: true, vars: true, white: true, plusplus: true*/
仅完成准备测试示例的所有工作之后，生成的代码没有您描述的问题.
After all the work with preparing the test example only the resulting code don't have the problems which you described.
这篇关于jqGrid行选择的怪异行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！