Showing/hiding ALL columns ? | Infragistics Forums

495

Showing/hiding ALL columns ?

Alex Paluzzi posted over 11 years ago

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

6279

[Infragistics] Borislav Traykov posted over 11 years ago in reply to Alex Paluzzi

Alex Paluzzi said:
Is there anything I can call to pull out the current order of the columns?
Hmm ... have you looked into the igGrid's column collection that I mentioned earlier? Aren't the column keys and hidden flags sufficient?

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
Cancel
Reply

Cancel
495

Alex Paluzzi posted over 11 years ago in reply to [Infragistics] Borislav Traykov

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
Cancel
Reply

Cancel
6279

Suggested Answer
[Infragistics] Borislav Traykov posted over 11 years ago in reply to Alex Paluzzi
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?
At least I can't recall such a precedent, to tell you the truth.

I think I've got your idea - so you're trying to have a history/chronology of what columns are hidden and shown after a couple of user actions.
If that is so, I can propose the following way of implementing it:

Hook up to the igGridHiding feature's columnHidden event. Keep in mind that it' only fired when a column is hidden through the UI, not the API!

Keep a dictionary/hashtable of the states of the columns each time the event is fired. Each entry in that dictionary can be a dictionary with column keys being the keys and the hidden flags - the values. You can get the column keys and the hidden flags from the igGrid's columns collection ($("#Grid1").igGrid("option","columns"))

Make the user save entries from that dictionary as desired states.

Simply call the igGrid or igGridHiding (whichever you prefer)'s showColumn() and hideColumn() API methods to display the columns in the desired configuration.

How does sound to you? Good enough or not? :)

Cheers,
Borislav
Cancel
Reply

Reject Answer

Cancel
495

Alex Paluzzi posted over 11 years ago in reply to [Infragistics] Borislav Traykov

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,

Alex
Cancel
Reply

Cancel

6279

Suggested Answer

[Infragistics] Borislav Traykov posted over 11 years ago

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

t78380.zip