Question

jqgrid列选择器中的列列表显示在单列中并截断：

Invalid layout

如何解决这个问题？ FireFox，Chrome，IE中出现问题页面定义如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="jquery-ui-1.8.12.custom.css" type="text/css" title="ui-theme" />
<link href="ui.jqgrid.css" rel="stylesheet" />
<link href="ui.multiselect.css" />
<link href="Site.css" rel="stylesheet" />
<script src="jquery-1.7.1.js" type="text/javascript"></script>
<script src="jquery-ui-git.js" type="text/javascript"></script>
<script src="jqgrid/plugins/ui.multiselect.js" type="text/javascript"></script>
<script src="jquery.contextmenu-fixed2.js" type="text/javascript"></script>
<script src="grid.locale-en.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery.jqGrid.src-multiselect1-deleteandsortpatches.js"></script>
    <script src="json2.js" type="text/javascript"></script>
    <script src="erp.js" type="text/javascript"></script>

    <script type="text/javascript">
    var $grid = $("#grid");
    $(function() {
      "use strict";
      $grid.jqGrid({
    ...

    $grid.jqGrid('navButtonAdd', '#grid_toppager', {
        onClickButton: function () {
            $(this).jqGrid('columnChooser', {
            });
        }
    });

Answer 1

如果您要获得一些使用columnChooser并且工作正常的工作演示，然后删除所需的ui.multiselect.css，那么您的结果将非常接近您的。

请参阅the demo哪个显示

enter image description here

因此，我建议您在Fiddler或Firebug中验证ui.multiselect.css在您的解决方案中是否已正确加载。可能你应该更换一行

<link href="ui.multiselect.css" />

行

<link href="jqgrid/plugins/ui.multiselect.css" />

对应于您使用的另一行

<script src="jqgrid/plugins/ui.multiselect.js" type="text/javascript"></script>

如何修复jqgrid列选择器垃圾布局

1 个答案: