使用服务器端事件在 jQWidget JQX 网格中显示过滤器、排序信息
Show filter, sorting information in jQWidget JQX grid with server side events
我已经实现了一个带有服务器端分页、排序、过滤的网格。现在我的用户已经保存了包含所有排序、过滤信息的网格。我已经生成了包含所有这些信息的查询。这意味着,当我再次加载该网格时,我将过滤和排序的数据提供给网格。尽管我已经给出了排序、过滤的数据,但现在事件会命中数据库,因为我正在应用如下过滤和排序属性。在这种情况下,如果我对网格中的 7 个字段进行了排序,它会访问 DB 8 次(7 次用于应用过滤器,一次用于第一次加载网格)。这会产生很多性能问题。
$(openFrom + "#jqxgrid").jqxGrid('sortby', sessionStorage.getItem("GridSortColumn"), sortdirectionvalue);
$(openFrom + "#jqxgrid").jqxGrid('addfilter', currentColumnFilterValue['columnname'], filterGroup);
$(openFrom + "#jqxgrid").jqxGrid('applyfilters');
这是我的源对象。
var source =
{
datafields: DataFields,
datatype: "json",
async: false,//If it is true, server side filtering and sorting won't work together
url: '../Widget/GetDataForGrid/',
type: 'POST',
sort: function () {
},
filter: function () {
},
beforeprocessing: function (data) {
}
};
所以我的要求是,我只需要在网格中显示筛选器、排序选择,而无需转到数据库。这仅适用于第一次(当首先加载具有排序、过滤信息的网格时)。当用户再次单击过滤器或用户尝试对另一个字段进行排序时,它应该像在服务器端过滤和排序一样工作。
非常感谢任何帮助。
我自己解决了。
我在准备好的文档中创建了一个变量并初始化如下
var isFilterSortGrid = false;
按如下方式更改源对象中的排序过滤器函数。
sort: function () {
if (isFilterSortGrid) {
$("#jqxgrid").jqxGrid('updatebounddata', 'sort');
}
},
filter: function () {
if (isFilterSortGrid) {
$("#jqxgrid").jqxGrid('updatebounddata', 'filter');
}
}
最后在过滤和清除按钮中单击我再次使该变量为真。
$(document).on('click', '#filterbuttonjqxgrid', function () {
isFilterSortGrid = true;
});
$(document).on('click', '#filterclearbuttonjqxgrid', function () {
isFilterSortGrid = true;
});
我正常应用过滤器和排序,所以过滤器选择会在那里。
我已经实现了一个带有服务器端分页、排序、过滤的网格。现在我的用户已经保存了包含所有排序、过滤信息的网格。我已经生成了包含所有这些信息的查询。这意味着,当我再次加载该网格时,我将过滤和排序的数据提供给网格。尽管我已经给出了排序、过滤的数据,但现在事件会命中数据库,因为我正在应用如下过滤和排序属性。在这种情况下,如果我对网格中的 7 个字段进行了排序,它会访问 DB 8 次(7 次用于应用过滤器,一次用于第一次加载网格)。这会产生很多性能问题。
$(openFrom + "#jqxgrid").jqxGrid('sortby', sessionStorage.getItem("GridSortColumn"), sortdirectionvalue);
$(openFrom + "#jqxgrid").jqxGrid('addfilter', currentColumnFilterValue['columnname'], filterGroup);
$(openFrom + "#jqxgrid").jqxGrid('applyfilters');
这是我的源对象。
var source =
{
datafields: DataFields,
datatype: "json",
async: false,//If it is true, server side filtering and sorting won't work together
url: '../Widget/GetDataForGrid/',
type: 'POST',
sort: function () {
},
filter: function () {
},
beforeprocessing: function (data) {
}
};
所以我的要求是,我只需要在网格中显示筛选器、排序选择,而无需转到数据库。这仅适用于第一次(当首先加载具有排序、过滤信息的网格时)。当用户再次单击过滤器或用户尝试对另一个字段进行排序时,它应该像在服务器端过滤和排序一样工作。
非常感谢任何帮助。
我自己解决了。
我在准备好的文档中创建了一个变量并初始化如下
var isFilterSortGrid = false;
按如下方式更改源对象中的排序过滤器函数。
sort: function () { if (isFilterSortGrid) { $("#jqxgrid").jqxGrid('updatebounddata', 'sort'); } }, filter: function () { if (isFilterSortGrid) { $("#jqxgrid").jqxGrid('updatebounddata', 'filter'); } }
最后在过滤和清除按钮中单击我再次使该变量为真。
$(document).on('click', '#filterbuttonjqxgrid', function () { isFilterSortGrid = true; }); $(document).on('click', '#filterclearbuttonjqxgrid', function () { isFilterSortGrid = true; });
我正常应用过滤器和排序,所以过滤器选择会在那里。