Question

我将styleUI设置为默认的jQueryUI。没有导航器中的操作，一切正常。当我尝试：

$('#grid').navGrid(
      '#pager',
      { edit: true} ,
      {
         editCaption: "The Edit Dialog",
         errorTextFormat: function (data) {
            return 'Error: ' + data.responseText
         }
      }
   );

Javascript崩溃并出现错误：

无法读取未定义的属性'styleUI'。

我该如何解决这个问题？

我有最新版本并包含ui.jqgrid.css和jquery.jqGrid.js。我做错了什么，但我不知道是什么

更新

<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" media="screen" href="path_to_ui_css_file/jquery-ui.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="base.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="path_to_ui_css_file/ui.jqgrid.css" />
</head>
    <body>
        <div class="wrapper">

           <button id="export">EXPORT</button> 
           <table id="grid"></table>
           <div id="pager"></div>
        <div> 

    <script src="jquery.js" type="text/javascript">
    <script src="jquery-ui.js" type="text/javascript">
    <script src="path_to_js_files/grid.locale-en.js" type="text/javascript"></script>
    <script src="path_to_js_files/jquery.jqGrid.js" type="text/javascript"></script>

     <script type="text/javascript">

           $(function() {
              $( document ).ready(function() {

                 $options = [       //OPTIONS WITHOUT COLMODEL
                                 'mtype' => 'GET',
                                 'url' => '...'
                                 'datatype' => 'json',
                                 'height'=> null,
                                 'width'=> null,
                                 'shrinkToFit' => false,
                                 'gridview'=> true,
                                 'sortable' => true,
                                 'autoencode' => true,
                                 'rowNum'=> -1,
                                 'pager' => '#pager',
                                 'viewrecords' => true,
                                 'rowList' => [10, 50, 100, -1],
                     ];
                 $('#grid').jqGrid(options); 

                 $("#button").on("click", function(){

                    $('#grid').jqGrid('exportToCsv'); //WORK CORRECT
                 });

                 $('#grid').navGrid(   //DOESNT WORK
                   '#pager',
                   { edit: true} ,
                   {
                       editCaption: "The Edit Dialog",
                       errorTextFormat: function (data) {
                           return 'Error: ' + data.responseText
                   }
                 }
               );
              });
           });
        </script>
</body>
</html>

我正在尝试@license Guriddo jqGrid JS - v5.2.1 - 2017-05-01

Jquery是较旧的jQuery v1.8.2

Answer 1

我找到了解决方案，这是我的错误。我在初始化元素中的jqgrid之前调用了navGrid。我简单地将来自beforeInit函数的代码转换为afterInit，一切正常。

Answer 2

当我收到此错误时，我正在处理子网格。为了解决这个问题，我使用链接定义了分页器功能，如下所示：

jQuery("#list").jqGrid({
    colModel: [
        { name: 'Name', width: 200, editable: true },
   //...

}).jqGrid('navGrid','#pager', { edit: true, add: true, del: false},

jqgrid guriddo - 无法读取未定义的属性'styleUI'

2 个答案: