调用loadState函数时，jqGrid不是函数-使用spring thymeleaf和jqGrid

Question

我在应用程序中使用Spring boot thymeleaf和jqGrid。 一切正常，直到我从jqGrid插件调用loadState函数以加载cols顺序，过滤等状态为止。 Columng命令加载但未加载数据，并且在浏览器的控制台中，我看到TypeError：table.jqGrid不是函数

 $.jgrid.saveState("table"); 

工作正常，并保存列的状态，但

$.jgrid.loadState("table");

不起作用。 有人遇到过同样的问题吗？

PS具有资源的我的代码按以下顺序加载：

css for jqgrid

<script type="text/javascript" th:src="@{/js/lib/jquery-1.11.3.min.js}"></script>
  <script type="text/javascript" th:src="@{/js/lib/grid.locale-ru.js}"></script>
<script type="text/javascript" th:src="@{/js/lib/jquery-ui.min.js}"></script>
  <script type="text/javascript" th:src="@{/js/lib/ui.multiselect.js}"></script>
    <script type="text/javascript" th:src="@{/js/lib/jquery.jqGrid.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/lib/chosen.jquery.min.js}"></script>

my js file with jqgrid table

这是我的项目中运行良好的一些示例：

var options = {
    datastr: grid_data,
    datatype: 'jsonstring',
    jsonReader: {
        root: 'gridModel',
        repeatitems: false
    },
    height: 'auto',
    editurl: URL,
    colNames: collnames,
    colModel: [
        {
            name: 'myac', index: '', width: 100, fixed: true, sortable: false, resize: false,
            formatter: 'actions',
            formatoptions: {
                keys: true,
                delbutton: false,//disable delete button
                editformbutton: true,
                editOptions: editOpt
            }
        },
        {
            name: 'id',
            label: 'ID',
            index: 'id',
            formatter: 'integer',
            width: 40,
            hidden: true,
            editable: true,
            editoptions: {disabled: true, size: 5}
        },

        {
            name: 'history',
            label: 'history',
            index: 'history',
            hidden: true,
            editable: true
        },
        {
            name: 'name',
            stype: 'text',
            label: 'name',
            index: 'name',
            editable: true,
            editOptions: {disabled: true},
            align: 'center'
        },
        {
            name: 'value',
            stype: 'text',
            index: 'value',
            editable: true,
            align: 'center'
        },
        {
            name: 'description',
            label: 'description',
            index: 'description',
            stype: 'text',
            align: 'center',
            editable: true
        }
    ],

    pager: pager,
    storeNavOptions : true,
    toppager: true,
    ignoreCase: true,
    rowNum: 15,
    rowList: [5, 10, 15, 20, 25, 30],
    altRows: true,
    viewrecords: true,
    subGrid: true,
    loadComplete: function () {

    },
};

工作不正确：

table.jqGrid({
    datatype: "json",
    jsonReader: {
        repeatitems: true
    },
    height: 'auto',
    colNames: colNames,
    colModel: colModel,
    url: URL_DATA,
    shrinkToFit: false,
    forceFit: true,
    pager: pager,
    toppager: true,
    rowNum: 10,
    rowList: [5, 10, 15, 20, 25, 30],
    loadonce: true,
    navOptions: {reloadGridOptions: {fromServer: true}},
    loadComplete: function () {
        var table = this;
        setTimeout(function () {
            updatePagerIcons(table);
            enableTooltips(table);
        }, 0);
    },
    gridComplete: function () {
        var idarray = table.jqGrid('getDataIDs');
        if (idarray.length > 0) {
            var firstid = table.jqGrid('getDataIDs')[0];
            table.setSelection(firstid);
        }
    }
});

$(window).triggerHandler('resize.jqGrid');//trigger window resize to make the grid get the correct size

Answer 1

如果您准备一个例子，那将是一个很好的选择。

如果在本地存储中的数据串不能被发现在LoadState不加载或作为你的情况的表ID不能在你打电话LoadState的地方被发现。 确保在调用loadState的位置存在id ='table'的表。