如何更改 jqgrid 寻呼机中的值

Posted 2023-02-26

【中文标题】如何更改 jqgrid 寻呼机中的值

【英文标题】：how to change values in jqgrid pager

【发布时间】：2019-06-10 09:51:20

【问题描述】：

高级开发人员。我是一名新开发人员，我不确定 jqgrid。

非常感谢您的帮助。 在 jqgrid 中查询大量数据时，我担心性能下降。所以我们只从 DB 中检索数据，与 rowNum 选择框的值一样多，以及数据的总计数连同数量。

我想根据响应改变pager的值 查询条件后的数据。 （jqgrid的寻呼机值-总计， 记录...）。

服务器响应对象的结构是

data: 
page: 
totalRowCount,
currentPage,
displayRowCount,
totalPage
,
fileInfoDtoList

就是这样。

totalRowCount 和 fileInfoDtoList 的大小不一样。

fileInfoDtoList 仅包含当前页面的表格中显示的数据。

totalRowCount 是实际条件查询中将生成的数据总数。

我尝试使用 setGridParam 更改 lastpage、records、total 并通过使用 getGridParam 将 jsonReader 分配给变量来更改内部值，但实际 pagerUI 值没有改变。

fileDataGrid.jqGrid(
                url: setUrl(),
                mtype: "GET",
                datatype: "json",
                colModel: [
                    
                        label: 'date', name: 'baseDate',
                        formatter: function (cellValue, options, rowdata) 
                            let fixedValue = cellValue.substr(0, 4) + "-" +
                                cellValue.substr(4, 2) + "-" +
                                cellValue.substr(6, 2);
                            return $.fn.fmatter.call(this, "date", fixedValue, options, rowdata);
                        ,
                        formatoptions: 
                            newformat: "Y-m-d"
                        
                        , align: 'center'
                    ,
                    label: 'aa', name: 'diseaseName', align: 'right',
                    label: 'bb', name: 'fileName', align: 'right',
                    label: 'cc', name: 'fileSize', align: 'right',
                    label: 'dd', name: 'fileStateName', align: 'center',
                ],
                jsonReader: 
                    records: 'page.totalRowCount',
                    total:'page.totalPage',
                    root: 'fileInfoDtoList',
                    page: 'page.currentPage',
                    repeatitems: false
                ,
                rowNum: 10, 
                viewrecords: true,
                rownumbers: true,
                emptyrecords: 'No Datas',
                loadonce: false,
                sortable: 'true',
                pager: '#pager',
                rowList: [10, 20, 30],



//paging event area
                onPaging: function (pgButton) 
                    console.log(pgButton);

                    setTimeout(function () 
                        $.ajax(
                            url: setUrl(),
                            method: 'get',
                            success: function (data) 
                                console.log(data);
                                let rowNum = $("#fileDataCollectJqGrid").getGridParam('rowNum');
                                let currentPage = $("#fileDataCollectJqGrid").getGridParam('page');
                                let lastPage = $("#fileDataCollectJqGrid").getGridParam('lastpage');
                                let totalrows = $("#fileDataCollectJqGrid").getGridParam('totalrows');

                                console.log(" rowNum : " + rowNum + " currentPage : " + currentPage + " lastPage : " + lastPage + " totalrows : " + totalrows );
                                fileDataGrid.jqGrid('clearGridData');
                                let jsonReader = fileDataGrid.jqGrid('getGridParam', 'jsonReader');
                                console.log(jsonReader);
                                jsonReader.total = 999;
                                console.log(fileDataGrid.jqGrid('getGridParam', 'jsonReader'));
                                fileDataGrid.jqGrid("setGridParam", 
                                    datatype: "local",
                                    data: data.fileInfoDtoList,
                                    lastpage: data.page.totalPage,
                                    records: data.page.totalRowCount,
                                );
                                fileDataGrid.trigger('reloadGrid');
                            
                        )
                    , 0);
                
            );

按钮事件区

 $("#searchButton").click(function () 
                $.ajax(
                    url: setUrl(),
                    method: "get",
                    success: function (data) 
                        console.log(setUrl());
                        console.log(data);
                        let $fileDataCollectJqGrid = $('#fileDataCollectJqGrid');
                        $fileDataCollectJqGrid.jqGrid('clearGridData');
                        $fileDataCollectJqGrid.jqGrid("setGridParam", 
                            datatype: "local",
                            data: data.fileInfoDtoList,
                            totalRows: data.page.totalPage,
                        );
                        $fileDataCollectJqGrid.trigger('reloadGrid');
                    
                );
            );

一开始我设置jqgrid的时候就知道pager的值是根据jsonReader的设置值来设置的。 条件查询后我尝试设置pager的值，但是pagerUI部分的值没有改变。

我尝试使用 setGridParam 更改寻呼机的总数（总页数）和记录数（总行数），但我更改了 lastpage、totalrows 等。但是，总行数已根据列表的大小而改变。

fileDataGrid.jqGrid("setGridParam", 
                                    datatype: "local",
                                    data: data.fileInfoDtoList, <<--changed total (total Page Count) value of pager as this size of list. 
                                    lastpage: data.page.totalPage,
                                    records: data.page.totalRowCount,
                                );

【问题讨论】：

使用的是哪个版本的jqGrid？您想在寻呼机中更改哪些确切参数？

@TonyTomov 你好 Tony Tomov 我正在使用 4.4.3 版本的 jqgrid，我想更改用作 jsonReader 属性的总数和记录。在上图中，无论数据数组的大小如何，我都想将 [Page 1 of "1"] 和 [View 1-20 of "20"] 更改为我指定的任何值。有可能吗？

jqGrid 版本 4.4.3 非常旧，不再受支持。您可以切换到支持的商业Guriddo jqGrid。可能您可以使用 beforeProcessing 事件修改这些，但我不确定此版本中是否提供此事件。检查文档

@TonyTomov 你是 jqGrid 开发者吗？

@TonyTomov 谢谢你的回复，我自己解决了问题。我以前postData，当我调用数据请求函数时，

【参考方案1】：

我自己解决了问题！ 当我调用数据请求方法时，刚刚将发布数据设置为 setGridParam。 我已经在 jsonReader 中设置了寻呼机数据。所以我可以解决我的问题。

 $('#fileDataCollectJqGrid').jqGrid('setGridParam', 
                postData: 
                    collectId: "$collectId",
                    baseDate: $('#dateInput').val(),
                    diseaseCode: $('#diseaseSelect').val(),
                    fileName: $('#fileNameInput').val(),
                    stateCode: $('#collectionStatus').val()
                ,
            ).trigger('reloadGrid');