Prevent Filter Removal from Grid Reload on New Row Insert

[ParadiseStudios]

I'm using ajax calls to fetch data from the server backend.

After applying filters to the table and then switching over to insert, the insert happens and then the grid reloads. When the grid reloads, it drops all of the previously applied filters.

url/api?name=jane&pageIndex=1&pageSize=15 becomes url/api?pageIndex=1&pageSize=15

Is there a way to keep the filters applied after a row is inserted?

Update: February 11, 2021

Here is the solution I had to do to make this work:

jsGrid.loadStrategies.PageLoadingStrategy.prototype.finishInsert = function(insertedItem) {
    this._grid.search(this._grid.getFilter());
}

[nandakumar-a]

Are you fetching data by ajax call inside the loadData([filter]) method or custom method? if you using loadData method then you can apply filter inside the loaadData method

[ParadiseStudios]

Yes I am passing filter through loadData. For some reason when the insert command is issued the filter wasn't being passed through. So I had to do a workaround. I'm not sure if it's a bug or something in my implementation.

loadData: function(filter) {
    $.extend(filter, {
        count: $("#jsGrid").jsGrid("_itemsCount"),
        csrf_token: validCSRFToken
    });
    return $.ajax({
        type: "GET",
        url: "url/api",
        data: filter
    });
}

[nandakumar-a]

try like this

 loadData: function(filter) {
      var d = $.Deferred();
       $.extend(filter, {
          count: $("#jsGrid").jsGrid("_itemsCount"),
          csrf_token: validCSRFToken
      });

    $.ajax({
        type: "GET",
        url: "url/api",
        data: filter,
        dataType: "json"
    }).done(function(result) {
        // client-side filtering
        result = $.grep(result, function(item) {
             return item.name=== filter.name;
        });

        d.resolve(result);
    })

    return d.promise();
}

[ParadiseStudios]

Client side filtering won't work. I've spent too much effort in server side filtering to change now.

Here is the original jsGrid.loadStrategies.PageLoadingStrategy.prototype.finishInsert function that I altered above to make the filter stay after row insert:

finishInsert: function(insertedItem) {
    this._grid.search();
}

It is my understanding that the whole point of calling search instead of refresh is so the filter won't be cleared when inserting a new row.

https://github.com/tabalinas/jsgrid#searchfilter-promise If filter is not specified the current filter (filtering row values) will be applied.

I'd make a codepen with my entire code if I could but I don't believe anything in my code is changing any of the default behavior of jsGrid. I do believe that the search call isn't preserving the filter but instead clearing it. That's why I had to explicitly tell search to preserve the filter in my altered function above.