Почему данные не выводятся в jqGrid без использования "hiddengrid: true"? - PullRequest
0 голосов
/ 05 июля 2018

Я хочу это:

enter image description here

Не нужно начинать так:

enter image description here

Но по какой-то причине данные отображаются только при использовании «hiddengrid: true»

Я попытался выполнить это demo и смог заставить пример работать, только добавив "hiddengrid: true", вот так:

<body>
<div class="center" id="overGrid">
    <table id="jqGrid"></table>
    <div id="jqGridPager"></div>
</div>
<script type="text/javascript">

    $(document).ready(function () {
        $("#jqGrid").jqGrid({
            url: 'api/codes',
            editurl: 'api/codes',
            colModel: [
                {
                    label: "Edit Actions",
                    name: "actions",
                    width: 75,
                    formatter: "actions",
                    formatoptions: {
                        keys: true,
                        editOptions: {},
                        addOptions: {},
                        delOptions: {}
                    }
                },
                {
                    label: 'Id',
                    name: 'id',
                    width: 150,
                    editable: true
                },
                {
                    label: 'Title',
                    name: 'title',
                    width: 100,
                    editable: true
                },
                {
                    label: 'Code',
                    name: 'code',
                    width: 100,
                    editable: true
                },
                {
                    label: 'Original Url',
                    name: 'originalUrl',
                    width: 200,
                    editable: true
                }
            ],
            align: 'center',
            viewrecords: true,
            rowList: [10, 20, 30],
            width: 925,
            height: 445,
            rowNum: 20,
            loadonce: true,
            hiddengrid: true, // <-------------------- HERE
            toppager: '#jqGridPager',
            pager: '#jqGridPager',
            caption: "Database"

        }); jQuery("#jqGrid")
            .navGrid('#pager', { edit: false, add: false, del: false, search: false })
            .navButtonAdd('#pager', {
                caption: "Add",
                buttonicon: "ui-icon-add",
                onClickButton: function () {
                    alert("Adding Row");
                },
                position: "last"
            })
            .navButtonAdd('#pager', {
                caption: "Del",
                buttonicon: "ui-icon-del",
                onClickButton: function () {
                    alert("Deleting Row");
                },
                position: "last"
            });

        function fetchGridData() {

            var gridArrayData = [];
            // show loading message
            $("#jqGrid")[0].grid.beginReq();
            $.ajax({
                url: 'api/codes',
                mtype: 'POST',
                datatype: 'JSON',
                success: function (result) {
                    for (var i = 0; i < result.items.length; i++) {
                        var item = result.items[i];
                        gridArrayData.push({
                            id: item.id,
                            title: item.title,
                            code: item.code,
                            originalUrl: item.originalUrl,
                        });
                    }
                    // set the new data
                    $("#jqGrid").jqGrid('setGridParam', { data: gridArrayData });
                    // hide the show message
                    $("#jqGrid")[0].grid.endReq();
                    // refresh the grid
                    $("#jqGrid").trigger('reloadGrid');
                }
            });
        }
        fetchGridData();
    });
</script>
</body>

Примеры, такие как this , похоже, не работают для меня сами по себе, поэтому я продолжаю ссылаться на другие источники, такие как this , которые являются гораздо более сложными и информативными, но возможно, причина того, почему у меня продолжают возникать проблемы на каждом этапе пути.

Примечание на стороне

Я, вероятно, должен указать, что я только недавно познакомился с jqGrid в результате этого вопроса, который я задал около недели назад: " Как я могу отделить свой вывод с помощью" onclick "и отформатировать данные в 20 на страницу? "

Я проделал довольно приличную работу по документированию шагов, которые привели меня к этому моменту, так что, возможно, стоит проверить подробный взгляд на то, с чем я имею дело.

Короче говоря, я создаю API в Asp.Net Core, который отправляет и получает данные JSON в мою базу данных MongoDb, а затем выводит данные на одну HTML-страницу с использованием jqGrid. До сих пор я создал функционирующие методы Get, Post, Put и Delete, которые возвращают и отправляют данные JSON в мою базу данных MongoDb.

Обновление:

Я просмотрел документы, предложенные Тони Томовым, и понимаю их значение. Я просто не имею ни малейшего понятия о решении этой проблемы. Все, что я считал возможным решением и попробовал до и после того, как я опубликовал этот вопрос, дало мне пустую страницу без каких-либо ошибок.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...