autosave/loadstate jqxGrid + column visibility checkbox list initialization

[YaniManParticipant]

Hello again helpful forum!

I have a jqxGrid with autosavestate:true, autoloadstate:true. I can hide/show the columns with a checkbox list. The data is loaded via ajax query. I can’t seem to initialize the checkboxes according to the auto-loaded state of the grid.

If i put the initialization code after the grid initializaton like this:

$("jqxgrid").jqxGrid({ ... });
InitializeCheckboxes();

then some error happens (getcolumn returns null, i think because the data is not arrived and the columns are not initialized yet).

If i put the initialization code in “ready” or “initialized” or “bindingcomplete” like
$("#jqxgrid").jqxGrid({ ready: function() { InitializeCheckboxes(); } ...... });
or

$("#jqxgrid").on("bindingcomplete", function()
{
    InitializeCheckboxes();
});

then it can run without error, but it is fired before the state was loaded and every column is reported as visible.
My question is: where should i put my initialization routine to work as expected?

jsFiddle link: http://jsfiddle.net/5YtCm/29/
Strange thing that the “initialized” event does not get called in jsFiddle with non-remote data (or who knows why). In my environment it gets called but as i wrote, before the state is loaded.

[Peter StoevKeymaster]

Hi YaniMan,

If you automatically load the Grid’s state, you will not be able to initialize your checkboxes in that way, because the state is saved and loaded when it is necessary. You need an event which is raised when the state is loaded, but there is no such event, so the option which I suggest you is to manually save and load the state and after loading the state( you will know when you call loadstate method), initialize the checkboxes. Loading and Saving a state can be achieved through the savestate and loadstate methods.

Best Regards,
Peter Stoev

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

[YaniManParticipant]

Hi Peter,

Thanks for the info. However i have some more problem with that as the columns does not exist (and can not be queried for visibility) before the data arrives from the ajax request so when i try to set the checkboxes, it “crashes”. Even if i try to set the checkboxes in initialized or in bindingcomplete event or in the ready or rendered behavior.

for(var h=0;h<this.columns.records.length;h++)
"Unable to get property 'length' of undefined or null reference" at _preparecolumngroups jqx-all.js:7:1273823

What do you think, where should i initialize the checkboxes?
Thanks for the so much help

[Peter StoevKeymaster]

Hi YaniMan,

I cannot know why your code crashes from the provided information. The bindingcomplete handler is raised when the Grid is rendered and the binding is completed so there is the best place to initialize your checkboxes which are in widget outside the Grid.

Best Regards,
Peter Stoev

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

[YaniManParticipant]

Oh wait, i thought wrong. The crash was in the loadstate method (because the columns didn’t existed yet). I moved the loadstate call to the bindingcomplete event and it works fine now.
(It seems strange to me that the columns does not exist until the data is loaded.)
Anyways thanks for the help again.

[Peter StoevKeymaster]

Hi YaniMan,

The columns array exists, but not the columns HTML Elements which are created during the data binding.

Best Regards,
Peter Stoev

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

[Author]

Posts