[Solved] column.hidden not working in IE8

[Helene Dumas]

Hello,
I have an MVC grid with a column.bound(x => x.id).hidden()
It works fine in IE7 but when I open my page in IE8, the hidden column is visible.
Any idea if this is a bug??

[Atanas Korchev]

Hello Helene Dumas,

You can try this:

column.Bound(x => x.Y).Hidden(true)

There is a known issue if you use just Hidden();

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Henry Ezeanya]

Hi, The Telerik Team,

I had a similar experience using hidden(), but when I used hidden(true), the column was hidden but the header of the column is still showing in the grid. How do I make both the header and the column completely hidden?

[Stéphan Parrot]

Hi, I have the very same problem:
If I use the .Hidden(true), the header is still showing...
Any suggestions on that?

Thanks

[Alex Gyoshev]

Hello Henry, Stéphan,

Please try to move the hidden column so that it is the last grid column and let us know how it goes.

Best wishes,
Alex Gyoshev
the Telerik team

[Henry Ezeanya]

I moved the column so that it is the last grid column, but it still did not hide the header column. But what I did to hide the header column was to add a HeaderHtmlAttribute;

columns.Bound(cg => cg.ClientID).Hidden(true).HeaderHtmlAttributes(new { @style = "display: none" });

Try it, it should work for you. The Hidden(true) method only hides the column body, but does not hide the column header.

[Stéphan Parrot]

Well, that's not very practical to move the column at the end anyways...
What if I want to hide more than one?
I'll try Henry's suggestion but, it's a bit frustrating to stump on this kind of limitation...

Thanks...

[Stéphan Parrot]

Ok, I tried Henry's suggestion (and also tried to move the column at the end just to see if that helps) but in my case, it doesn't work when the value passed to the Hidden method is false...

Explanation:
I have a grid that will only show a specific set of columns if the user is of a specific type. We have agents and dealers that uses the system and Agents can see All columns: A, B, C, D and E for example.
Dealers can only see A, B and D.
Also, there's a last column in the grid (let's call it column F) that is used to display a checkbox so that the user can check to mark the row for deletion. (You can understand why moving the columns that might be hidden isn,t very practical in my case as stated in the previous post)

so, I set the columns this way:

[...]
    columns.Bound(c => c.ColumnA)
        .Width(200);
    columns.Bound(c => c.ColumnB)
        .Width(200);
    columns.Bound(c => c.ColumnC)
        .Width(200)
        .Hidden(IsAgent) //IsAgent is a bool flag  variable set before the grid
        .HeaderHtmlAttributes(new { @style=IsAgent?string.Empty:"display:none"});
    columns.Bound(c => c.ColumnD)
        .Width(200);
    columns.Bound(c => c.ColumnE)
        .Width(200)
        .Hidden(IsAgent)
        .HeaderHtmlAttributes(new { @style=IsAgent?string.Empty:"display:none"});
    columns.Bound(c => c.ColumnF)
        .Width(200);
[...]

When the IsAgent is equal to false, all is fine and the columns hides themselves properly but, if the IsAgent is equal to true, I see the header but not the column which should show up...

I'm stumped on this one and time is ticking here...

Hope the example was clear enough to get some answers back without to have to zip a sample project...

[Alex Gyoshev]

Hello Stéphan,

In the scenario that you describe, it seems more viable to use the Visible method instead of the Hidden one,

columns.Bound(c => c.CompanyName).Width(200);
columns.Bound(c => c.ContactName);

columns.Bound(c => c.ContactTitle).Width(200).Visible(IsAgent);

columns.Bound(c => c.Address).Width(200);
columns.Bound(c => c.Country).Width(200);

columns.Bound(c => c.City).Width(200).Visible(IsAgent);

The difference between both is that Visible controls whether the columns is rendered, and Hidden controls whether the user will see it (i.e. Hidden will render the column, but it will be hidden for the user, unless he/she views the page source).

The Hidden property is used when you need to have access to a given field in the client script (say, the row ID), but you don't want to show it to the user (in the case of the row ID, it is part of the implementation and irrelevant to the user). So, using Hidden for confidential information that shouldn't be viewed by a user with insufficient permission will expose the information.

Kind regards,
Alex Gyoshev
the Telerik team

[Stéphan Parrot]

Hi Alex, 
    Thanks a lot for the clarification!
For those who wants to read about it (I should have done this before posting...), here's thedocumentation that states it very clearly:
http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-columns.html#columnconfig

Documentation for
- Hidden:
http://www.telerik.com/help/aspnet-mvc/overload_telerik_web_mvc_ui_fluent_gridcolumnbuilderbase_2_hidden.html

- Visible:
http://www.telerik.com/help/aspnet-mvc/m_telerik_web_mvc_ui_fluent_gridcolumnbuilderbase_2_visible.html

Have a nice day!

Stéphan