I have been developing an app to use jQuery's jqGrid plugin, and I thought I had it all wrapped up until I tried to view the grid in IE. In IE, the grid appears with a much larger height in the .ui-jqgrid-view div, but the data itself stays at a smaller size and displays at the bottom of the container div (.ui-jqgrid-view). I need to get the grid to display "properly". I don't care if it is the larger size (that IE displays) or smaller (as in FF)... I just need to have the data fill the grid area. Thanks!
I uploaded a screenshot: here
Grid Code:
$("#list").jqGrid({
url: gDataPath,
datatype: 'json',
mtype: 'GET',
colNames: ['Id', 'VId', 'First Name', 'Last Name', 'MId'],
colModel: [
{ name: 'ID1', index: 'ID1', width: 75, align: 'left' },
{ name: 'VID', index: 'VID', width: 75, align: 'left' },
{ name: 'FirstName', index: 'FirstName', width: 225, align: 'left' },
{ name: 'LastName', index: 'LastName', width: 225, align: 'left' },
{ name: 'MIDno', index: 'MIDno', width: 260, align: 'left'}],
pager: jQuery('#pager'),
rowNum: 100,
rowList: [50, 100, 200, 500],
sortname: 'ID1',
sortorder: "desc",
viewrecords: true,
imgpath: 'http://mysite/Content/images',
caption: 'Project Name Data',
ondblClickRow: function(rowid, iRow, iCol) {
var i = jQuery("#list").getRowData(rowid);
window.location = '<%=linkPath %>/'+ i.VisitID;
}
});