JQgrid 4.8列宽在IE9中不起作用

时间:2015-04-21 15:34:51

标签: javascript jquery html css jqgrid

我正在将我的jqGrid从4.4.5更新到4.8.2并注意到列宽已停止工作(在IE9中)。网格中的宽度刚刚包裹了该列中的文本。我找到了这个帖子:(jqgrid not work on IE8),唯一有效的演示是demo46。 我在下面放了一个网格副本,看看是否需要更改以解决问题。

var myColNames = ['ID', 'Name'];
var myColModel = [
    { name: 'ID', index: 'ID', width: 50, key: true, hidden: false, editable: true },
    { name: 'Name', index: 'Name', width: 150, key: true, hidden: false, editable: true },   
];

grid.jqGrid({
    url: URL,
    datatype: 'json',
    ajaxGridOptions: { contentType: "application/json" },
    colNames: myColNames,
    colModel: myColModel,
    loadonce: true, // enables sorting on client side
    hidegrid: false, // disable ^ button to show/hide
    ignoreCase: true, // client side sorting and filtering becomes case insensitive
    rowNum: gridRows, // number of rows to display per page
    height: 'auto',
    rowList: [10, 20, 50, 100, 500], // drop down for number of rows to display per page
    pager: pagerName, // name of pager div to display the pager in
    altRows: true,
    altclass: 'AIMAltRow',
    viewrecords: true,
    shrinkToFit: false, // enable scrolling of headers
    gridview: true,
    sortname: 'ID',
    sortorder: 'desc',
    rownumbers: true,
});

2 个答案:

答案 0 :(得分:0)

在jqGrid 4.7中的IE8兼容性确实存在问题,所以免费的jqGrid 4.8也是如此。我不能对Guriddo jqGrid JS 4.8或Guriddo jqGrid JS 4.8.2说什么,但问题是在免费的jqGrid中解决的。我在你引用的答案中添加了the demo。最后一个演示使用当前的(post free jqGrid 4.8)代码。我不知道IE8 / IE9中的任何问题。试试吧。

如果您想通过包含指向GitHub代码的直接链接来尝试新的免费jqGrid代码(请参阅the wiki article):

<link href="https://rawgit.com/free-jqgrid/jqGrid/master/css/ui.jqgrid.css" rel="stylesheet">
<script src="https://rawgit.com/free-jqgrid/jqGrid/master/js/i18n/grid.locale-en.js"></script>
<script src="https://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.min.js"></script>

我建议你另外加上

<link href="https://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">

并添加新的jqGrid iconSet: "fontAwesome"。您将看到网格的外观会更好,尤其是在Web浏览器中使用缩放时。在wiki中查看有关Font Awesome用法的更多详细信息。

您可以从github下载代码。它包含jquery.jqgrid.min.jsjquery.jqgrid.src.jsjquery.jqgrid.min.mapui.jqgrid.css(或ui.jqgrid.min.css)以及所有不同语言的特定区域。

顺便说一句,您发布的小代码包含重要错误。您在两列中使用key: true,这是错误的。可以将key: true仅放在一列中。另一个错误是在最后一个参数(,)之后使用rownumbers: true。它在IE8中产生语法错误

答案 1 :(得分:0)

更新到修复它的新ui.jqgrid.css。感谢Oleg的推荐