Hello,
I'm wondering if it's possible to show or hide all of the columns with the Column Hiding feature? In the documents, I can only see ways to show or hide things, but nothing like a "show all" or "hide all" or even "reset". I'm trying to figure out an elegant way to save column visibility templates, and I don't see a method to send both visible and hidden at once.
Thanks,
Alex
Hi Alex,I'm afraid that the grid doesn't offer a "show all/hide all" functionality out of the box.I'd also like to make notice of the design decision which we took when we implemented the igGrid: The grid must display at least one column. (and when you think about it, if there are no columns to show, why display an entire grid at all?)With this in mind, you can apply all kinds of code tricks in order to "hide" or show all columns.For example you can hide the entire grid when there are no columns to display using either of these approaches:
//If you want to collapse the space that would otherwise be taken by the lack of a grid $("#Grid1").hide(); //If you want to keep the space on the page that would be taken by the lack of a grid $("#Grid1").css('visibility','hidden');
Also, here's a sample "show all columns" function:
function showAllColumns() { //Just in case the the grid was hidden before if($("#Grid1").css('visibility') === "hidden") { $("#Grid1").css('visibility','visible'); } else { $("#Grid1").show(); } var gridColumns = $("#Grid1").igGrid("option", "columns"); for(var i = 0; i < gridColumns.length; i++) { if(gridColumns[i].hidden) { $("#Grid1").igGrid("showColumn", gridColumns[i].key); } } }
I'm also attaching a working HTML sample page where you can see my suggestions in effect.Hope this helps,Borislav
Hi Borislav,
Thanks for the response. That is very helpful and I'll likely be implementing something that uses that.
Mind a follow-up?
I wonder, is there any precedent on how I might be able to get a snapshot of how the columns in the grid are being displayed after tinkered with on the front-end? I'd be looking for not only one is shown/hidden, but also the order of the columns after they might have been moved around.
I'm assuming if I was able to pull that out, I'd be able to use the manipulate ways to snap back and forth between user-saved "states"?
Thanks again,
Hey Alex,No, I don't mind a follow-up at all. Such a meaningful one is even warmly welcomed :).
Alex Paluzzi said:I wonder, is there any precedent on how I might be able to get a snapshot of how the columns in the grid are being displayed after tinkered with on the front-end?
How does sound to you? Good enough or not? :)Cheers,Borislav
Yes, that does sound good. That was actually the direction I was going! But that solves half of the problem.
Is there anything I can call to pull out the current order of the columns? It would be much easier for me to pull that out when a user would click "save," for instance. If there's no (reasonable) way for me to programmatically pull out the order of the columns, then I imagine I'll have to do something similar by hooking into an event that's fired when columns get moved? Seems that like could get messy.
Thanks again :)
Alex Paluzzi said:Is there anything I can call to pull out the current order of the columns?
What the hiding logic does is to iterate across the column collection and see what needs to shown/hidden (the modal dialog works that way).If that's working out for you, can you please provide me with an example of what order do you need?You can use the HTML sample I had provided earlier in order to present the predicament.Cheers,Borislav