jqGrid 结果溢出网格

Question

我正在使用 jqGrid。问题是网格的结果溢出了网格。

但我想用水平和垂直滚动条设置固定的宽度和高度。我在 stackoverflow 上已经发现了两次这个问题：

1. jqGrid Results over flow the grid and "Please, Select Row" message

通过加载“jquery-ui.js”解决了上述问题。这对我没有帮助。

2. Does jQuery jqGrid support horizontal scroll bar and frozen columns?

我按照上面问题的答案，设置了以下选项：

myGrid= $("#myGrid").jqGrid({
   ...,
    colNames: ['MATNR', 'ARKTX', 'KDMAT', 'KBMENG', 'VRKME', 'BRGEW', 'GEWEI'],
    colModel: [
        { name: 'MATNR', key: true },
        { name: 'ARKTX' },
        { name: 'KDMAT' },
        { name: 'KBMENG' },
        { name: 'VRKME' },
        { name: 'BRGEW' },
        { name: 'GEWEI' }
    ],
    width: 600,
    height: 200,
    shrinkToFit: false,
    forceFit: false,
    pager: "#myPager",
});

3.我还找到了一个答案，它建议设置每一列的宽度而不是网格的宽度以查看水平和垂直滚动条：

    myGrid= $("#myGrid").jqGrid({
    ...,
    colModel: [
        { name: 'MATNR', key: true },
        { name: 'ARKTX', width: 100  },
        { name: 'KDMAT', width: 100  },
        { name: 'KBMENG', width: 100  },
        { name: 'VRKME', width: 100  },
        { name: 'BRGEW', width: 100  },
        { name: 'GEWEI', width: 100  }
    ],
    //width: xxx,
    ...
 });

还加载了以下脚本/样式：

// Scripts
jquery-1.10.2.js
grid.locale-en.js
jquery.jqGrid.min.js (Version 4.6.0)
jquery-ui.min.js (Version 1.11.2)
// Styles
jquery-ui.min.css
jquery-ui.theme.min.css

HTML：

<div id="gridContainer">
     <table id="myGrid"></table>
     <div id="myPager">
</div>

我在 IE11、IE10 和 Firefox (v 33.1) 上进行了尝试。

不幸的是，这没有任何帮助。我想要的滚动条没有出现。

更新：我刚刚提供了一个 jsfiddle 示例 - 但它有效：

http://jsfiddle.net/CzVVK/1082/

更新 2： 我注意到删除 jsfiddle（外部资源）中的 css ui.jqgrid.css 可以重现我的问题！但是我以为jqgrid没有特殊的样式文件？我是否遗漏了什么或者为什么它不能使用默认的 jquery.ui.css？

http://jsfiddle.net/CzVVK/1083/

Answer 1

我必须添加包含在默认 jqGrid 下载文件夹中的文件 ui.jqgrid.css。添加jquery-ui.css是不够的。