Clearing Filters When Updating Source

[user1397Participant]

Hi,

I have a jqxgrid running in virtual mode. I saw here that “when you change the Grid’s Data Source, any previous sorts, filters, etc. will be removed by design,” but I’m not seeing that behavior.

When I try to change the data source, the filters remain and filter the results from the new data source. My current work around is to change the data source and then do a “clearfilters” on the grid, but that causes two requests to be sent to the server. Is there another approach or a setting that I’m missing?

[DimitarParticipant]

Hi user1397,

And how do you change the data source. Is it by re-setting the source property?

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[user1397Participant]

Yes… I set a flag on the grid if it has been instantiated and next time it refreshes its data it does this:

        var dataAdapter = new $.jqx.dataAdapter(source, {
            loadComplete: function (data) {  },
            loadError: function (xhr, status, error) {
                alert(error);
            }
        })
       $(jqxGridId).jqxGrid({ source: dataAdapter });

I made a jsfiddle that kinda shows the issue I’m seeing. When virtualMode is false, the filter is removed on data refresh. When it’s set to true, the filter remains. The jsfiddle is here.

[user1397Participant]

I just noticed this affects paging too. When I change source, if I’m on page 3 it remains on page 3… I can do “.jqxGrid(‘gotopage’, 0);” but then I’m sending yet another request to the server…

One to go to page 0
One to clear filters
One to get the new data source

And the worst part is they don’t return in the order I sent them, so sometimes I get the new data source set, then I get the clear filters with the previous data source and I end up seeing old data. Why does this happen? I’m using version 3.7.1… I saw in another thread that this issue shouldn’t be happening as of v2.8.3.

[DimitarParticipant]

Hi user1397,

When you have implemented server-side paging, filtering, etc., a server request will be made for each change made to the paging, filtering, data, et al. If the requests are asynchronous (the source object’s async property is set to true, the default value), you would need to wait for one request to finish to make another. In this case, you can use the bindingcomplete event which will be triggered after each server operation has been completed and the grid has been re-bound to the data source.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[user1397Participant]

So you’re saying the solution to my issue is to change the data source and set some flags so that it calls binding complete several times and each time does the next operation? Essentially making the async behavior of the grid synchronous? Why not just flip the async flag anyway?

[DimitarParticipant]

Hi user1397,

You can use either of these solutions, but the benefit of the ad hoc “bindingcomplete” approach is that when you have only one server operation, it will still be executed asynchronously, something that would not be true if async is false.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[user1397Participant]

Are there any plans to change this functionality? Even following your advice, I still end up with extra server calls and it actually even takes longer now because of the bindingcomplete pauses between each call.

[DimitarParticipant]

Hi user1397,

Another possibility is not to use the built-in callbacks for server-side synchronisation, but pass all necessary data to the server in a single, custom, Ajax call. However, I am not sure how good a solution would this be from a user perspective. Other than that we cannot offer you anything else, unfortunately.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[user1397Participant]

pass all necessary data to the server in a single, custom, Ajax call.

How would I go about doing that? Is there a way to hijack the ajax call done by the grid?

[DimitarParticipant]

Hi user1397,

That is the point – you do not make use of the grid’s server-side synchronisation functions. On an event of your choice (e.g. the click of a button), you make an Ajax call and pass whatever data you wish through the call’s data property/object. Server-side, you read this object and return the appropriate data. Finally, you synchronise with the client-side in the Ajax call’s success callback.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[user1397Participant]

If I follow this approach though, I won’t be able to make use of the grid’s native filtering and sorting. I mean, I would have to essentially implement a custom ajax caller and then still allow the grid to use its own at the same time?

[DimitarParticipant]

Hi user1397,

I have listed all the available options in my replies. It is up to you which one you will choose. Unfortunately, there are no other suggestions we can offer you on the matter.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts