загрузили страницы локально при получении новой страницы данных jqgrid

0

Я использую простой jqgrid, и я загружаю данные по запросу, когда прокручиваются до нижних огней. я хочу сохранить предыдущие загруженные данные (загруженную страницу) и загрузить новые данные на прокрутке (новая страница). Я не знаю, как сохранить предыдущие данные при прокрутке вниз, старые данные заменяются новыми, как я могу решить Это?

        $Grid.jqGrid({
        type:'POST',
        datatype:'jsonstring',
        datastr:data,
        // url:data,
        // datatype: 'json',
        jsonReader:{
            repeatitems:false,
            root:"result",
            total:function (obj) {
                return obj.total;
            },
            records:"total"
        },
        direction:"rtl",
        sortable:true,
        colNames:[Dictionary.Statement().serial , Dictionary.Statement().date, Dictionary.Statement().time, Dictionary.Statement().credit, Dictionary.Statement().debit, Dictionary.Statement().balance, Dictionary.Statement().details, Dictionary.Statement().description, '', '', '', '', ''],
        colModel:[
            { label:'serial', name:'serial', index:'serial', search:true, width:100, align:'center' },
            { label:'date', name:'date', index:'date', width:50, editable:true, jsonmap:"shamsiDate.date", align:'center' },
            { label:'time', name:'time', index:'time', width:50, editable:true, jsonmap:"shamsiDate.time", align:'center' },
            { label:'credit', name:'credit', index:'credit', width:150, align:'center', editable:true },
            { label:'debit', name:'debit', index:'debit', width:50, align:'right', editable:true },
            { label:'balance', name:'balance', width:50, search:true, align:"right", editable:true },
            { label:'details', name:'details', width:50, fixed:true, sortable:false, resize:false, align:"center", formatter:jqgridSetting.ShowRowDetailsCol },
            { label:'description', name:'description', index:'description', sortable:false, hidden:true, hidedlg:true },
            { label:'branchCode', name:'branchCode', hidden:true, hidedlg:true },
            { label:'branchName', name:'branchName', hidden:true, hidedlg:true },
            { label:'registrationNumber', name:'registrationNumber', hidden:true, hidedlg:true },
            { label:'agentBranchCode', name:'agentBranchCode', hidden:true, hidedlg:true },
            { label:'agentBranchName', name:'agentBranchName', hidden:true, hidedlg:true }
        ],
        rowNum:50,
        pager:'#StatementPager',
        sortname:'date',
        viewrecords:true,
        sortorder:"desc",
        caption:"صورت حساب",
        gridview:true,
        rownumbers:true,
        shrinkToFit:true,
        autowidth:true,
        loadComplete:function () {
            jqgridSetting.SetRowStyle();
        },
        subGrid:true,
        subGridRowExpanded:function (subgrid_id, row_id) {
            addRowData = $Grid.jqGrid('getRowData', row_id);
            var html = '<span style=" direction: rtl;float: right;margin-right:10px">' + addRowData.description + '</span>';
            $("#" + subgrid_id).append(html);
            jqgridSetting.EditSubgrid();
        },
        gridComplete:function () {
            var subGridHeader = $('.StatementGridWrapper').find('#StatementGrid_subgrid').children(':first');
            if ($('span.ui-icon-plus', '#jqgh_StatementGrid_subgrid').length == 0) {
                subGridHeader.append('<span class="ui-icon ui-icon-plus"></span>').css('margin', '-1px 2px 0px 0px');
                $(subGridHeader.children('span.ui-icon-plus')[0]).click(function () {
                    jqgridSetting.ShowMoreInfo()
                });
            }
            jqgridSetting.SetGridHeaderStyle('#StatementGrid_rn');

            $('.ui-jqgrid-bdiv','#gview_StatementGrid').on('scroll', function (e) {
                var $o = $(e.currentTarget);
                if ($o[0].scrollHeight - $o.scrollTop() <= $o.outerHeight()) {
                    alert('scrolltobottom');
                    var totalRow = $Grid.jqGrid('getGridParam', 'reccount');
                    var formData = {
                        'offset':totalRow == 0 ? 0 : totalRow - 1,
                        'length':50,
                        'depositNumber':$("#depositNumber").val(),
                        'action ':$("#action").val(),
                        'fromDate':$("#fromDate").val(),
                        'toDate':$("#toDate").val(),
                        'fromTime':$("#toTime").val(),
                        'toTime':$("#fromTime").val()
                    }
                    jqgridSetting.PostFormData("/statement/search", formData, 'Statement.SetupStatementGrid', true);
                }
            });
        }
    });
    $Grid.jqGrid('navGrid', '#StatementPager', { edit:false, add:false, del:false, search:false });
  • 0
    Непонятно, что за прокрутку вы имеете в виду. Вы имеете в виду проблемы в $('.ui-jqgrid-bdiv','#gview_StatementGrid').on('scroll', ...) части вашего кода? Вы действительно используете datatype:'jsonstring', datastr:data а не datatype: 'json' ? Вы реализовали пейджинг на стороне сервера? Сколько данных может быть максимально загружено в jqGrid (50, 1000, 10000 или более)? Вероятно, datatype: 'json' с loadonce: true будет лучшим выбором для вас?
  • 0
    @ Олег благодарит Олега за ваш ответ, в первую очередь да, я использую тип данных: 'jsonstring', datastr: данные, а не тип данных: 'json', потому что ответ сервера - json, и я не знаю почему, но когда я использую тип данных: 'json «это не работает, я имею в виду, что данные не загружаются, поэтому, когда я изменил их на тип данных:« jsonstring », datastr: data, он работает нормально. Если у вас есть какие-либо проблемы, то скажите, пожалуйста, что не так?
Показать ещё 2 комментария
Теги:
scroll
jqgrid
lazy-loading

1 ответ

0
Лучший ответ

Я вижу много мелких проблем в вашем коде. Я бы рекомендовал вам использовать datatype:'json' вместе с loadonce: true вместо типа datatype:'jsonstring'. Если у вас сотни строк, загрузка моих данных достаточно быстро. Таким образом, вы можете вернуться с сервера только по всем строкам. jqGrid отобразит первые 50 строк (потому что вы используете rowNum:50), и пользователь может использовать локальный пейджинг данных, который, как правило, очень быстро.

Если у вас возникли проблемы с использованием типа datatype:'json' и загрузка данных напрямую, вы должны добавить свой вопрос с точным ответом с сервера. Я лично использую Fiddler для отслеживания трафика HTTP между клиентом и сервером. Здесь вы найдете точные данные JSON. Типичная ошибка новичков - это дополнительное ручное преобразование данных (объекта) в строку JSON. В случае, когда строка JSON будет преобразована в JSON во второй раз платформой.NET. В случае, если вы видите скрытые кавычки в ответе сервера (\"). Вероятно, у вас есть другая проблема, но для ее локализации нужно увидеть ответ сервера.

Если вам нужны дополнительные данные для сервера depositNumber, action, fromDate, toDate и т.д., Вы можете использовать postData свойства которого определяются как функции (см. Ответ) для более подробной информации.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню