JqxGrid过滤器值在更新绑定数据时清除

JqxGrid Filter values clear when updatebound data

本文关键字:数据 清除 绑定 更新 过滤器 JqxGrid      更新时间:2023-09-26

我有一个带有RowFilters的网格。我正在从DB中搜索值,这是我的jqxgrid。

var source =
      {
          datatype: "obserableArray",
          datafields: [
              { name: 'ReceiptId', type: 'int' },
              { name: 'Receipt', type: 'string' },
              { name: 'ReceiptTypeId', type: 'int' },
              { name: 'ReceiptType', type: 'string' },
              { name: 'CustomerId', type: 'int' },
              { name: 'Customer', type: 'string' },
              { name: 'ReceiptDate', type: 'date' },
              { name: 'PaymentTypeId', type: 'int' },
              { name: 'PaymentType', type: 'string' },
              { name: 'Total', type: 'float' },
              { name: 'Select', type: 'bool' }
          ],
          id: 'ReceiptId',
          localdata: fnCmnBankDepositViewModel.AvailableBankDepositReceiptsList()
      };
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize jqxGrid
$("#jqxReceiptgrid").jqxGrid(
{
    width: '100%',
    source: dataAdapter,                
    pageable: true,
    autoheight: true,
    sortable: true,
    altrows: true,
    enabletooltips: true,
    editable: true,
    selectionmode: 'multiplecellsadvanced',
    columnsresize: true,
    showfilterrow: true,
    filterable: true,
    columns: [

      { text: 'Reciept', datafield: 'Receipt', editable: false },
      { text: 'ReceiptTypeId', datafield: 'ReceiptTypeId', width: '10%', sortable: false, editable: false },
      { text: 'Receipt Type', datafield: 'ReceiptType', width: '10%', sortable: false, editable: false },
      { text: 'CustomerId', datafield: 'CustomerId',  sortable: false, editable: false },
      { text: 'Customer', datafield: 'Customer',  sortable: false, editable: false },
      { text: 'Receipt Date', datafield: 'ReceiptDate', width: '15%', filtertype: 'date', cellsformat: 'd', editable: false },
      { text: 'PaymentTypeId', datafield: 'PaymentTypeId', width: '10%', sortable: false, editable: false },
      { text: 'Payment Type', datafield: 'PaymentType', width: '10%', sortable: false, editable: false },
      { text: 'Total', datafield: 'Total', sortable: false, filtertype: 'number', editable: false },
        {text: 'Select', columntype: 'checkbox', sortable: false,datafield: 'Select', filtertype: 'bool'}
    ]
});
$("#jqxReceiptgrid").jqxGrid('hidecolumn', 'RecieptId');
$("#jqxReceiptgrid").jqxGrid('hidecolumn', 'Reciept');
$("#jqxReceiptgrid").jqxGrid('hidecolumn', 'CustomerId');
$("#jqxReceiptgrid").jqxGrid('hidecolumn', 'ReceiptTypeId');
$("#jqxReceiptgrid").jqxGrid('hidecolumn', 'PaymentTypeId');
$("#jqxReceiptgrid").jqxGrid('applyfilters');
$("#jqxReceiptgrid").bind('cellendedit', function (event) {
    var args = event.args;
    var row = event.args.rowindex;
    var datarow = $("#jqxReceiptgrid").jqxGrid('getrowdata', row);
    if (args.value === true) {
        AddReceipttoSave(datarow);
    } else {
        RemoveReceipt(datarow);
    }
});
$("#jqxReceiptgrid").on("filter", function (event) {
    var filterinfo = $("#jqxReceiptgrid").jqxGrid('getfilterinformation');
    fnCmnBankDepositViewModel.GetReceiptsbyFilter(filterinfo);
});

一旦过滤器工作过滤器值被发送到DB,我在另一个函数中填充本地数据并在另一个函数中更新绑定。

for (var i = 0; i < 50; i++) {
        var tmpObj = {
            ReceiptId: i + 1,
            Receipt: "Receiipt" + i,
            ReceiptTypeId: 1,
            ReceiptType: "Invoice",
            CustomerId: i + 1,
            Customer: "Nimal" + i,
            ReceiptDate: "2015/08/05",
            PaymentTypeId: 1,
            PaymentType: "Cash",
            Total: 56.25,
            Select: false
        };
        fnCmnBankDepositViewModel.AvailableBankDepositReceiptsList.push(tmpObj);
    };
    var source =
      {
          datatype: "obserableArray",
          datafields: [
              { name: 'ReceiptId', type: 'int' },
              { name: 'Receipt', type: 'string' },
              { name: 'ReceiptTypeId', type: 'int' },
              { name: 'ReceiptType', type: 'string' },
              { name: 'CustomerId', type: 'int' },
              { name: 'Customer', type: 'string' },
              { name: 'ReceiptDate', type: 'date' },
              { name: 'PaymentTypeId', type: 'int' },
              { name: 'PaymentType', type: 'string' },
              { name: 'Total', type: 'float' },
              { name: 'Select', type: 'bool' }
          ],
          id: 'ReceiptId',
          localdata: fnCmnBankDepositViewModel.AvailableBankDepositReceiptsList()
      };

    //$("#jqxReceiptgrid").jqxGrid('updatebounddata');
    var dataAdapter = new $.jqx.dataAdapter(source);
    $("#jqxReceiptgrid").jqxGrid({ source: dataAdapter });

但是一旦这个网格被更新,过滤器搜索值变得清晰,我怎么能设置网格而不清除过滤器值

我找到了解决方案

$("#jqxReceiptgrid").jqxGrid('updatebounddata', 'cells');