Grid hidding column resize issue

[Vladimir]

Hi

I have a RadGrid with client side binding through webservice. Everything works great, but I need to hide column for regular users and show all to admin. I am using the hideColumn() and showColumn() procedure, it works, it hides the column, but the Grid is not resizing to fill the new space. I have 1 column defined without width and I want this column to be resized. I dont want to allow the user to resize the column, but if it must the so be it. I tried every possible combination of allowColumnResizing, ResizeGridOnColumnResize, Clip... also tried tableLayout, also manual column resizing and I tried to move hidding to different events like OnDataBinding, OnDataBound, OnMasterTableCreating, OnGridCreating and so on, but nothing works as expected. At server side it is so simple so why is client side so hard??

thanks 

Vitalij

[Galin]

Hi Vitalij,

This is a known issue and our developers are working on it. The fix will be implemented in our future releases. In the meantime, could you use the following JS workaround

function onColumnHidden(sender) {
    var dataTable = sender.get_masterTableView().get_element(),
        headerTable = sender.get_masterTableViewHeader().get_element();
    dataTable.style.tableLayout = "auto";
    headerTable.style.tableLayout = "auto";
    if ($telerik.isIE8) {
        dataTable.style.position = "absolute";
        headerTable.style.position = "absolute";
    }
    window.setTimeout(function () {
        dataTable.style.tableLayout = "fixed";
        headerTable.style.tableLayout = "fixed";
        if ($telerik.isIE8) {
            dataTable.style.position = "static";
            headerTable.style.position = "static";
        }
    }, 1)
}

I hope this helps.

Kind regards,
Galin
the Telerik team

[Vladimir]

Hi  Galin

Thanks for response, but it doesnt work. When should I call the hideColumn procedure?? OnMasterTableViewCreating or OnGridCreating or OnGridCreated or else?? Do I have to allow ColumnResize or/and ResizeGridOnColumnResize or else?? There is so many options... 

Thanks

[Galin]

Hello,

You should attach the function OnColumnHidden event. I am sending a sample demonstration page. You can find it in the attached file.

Please check it out and let me know how it goes.

All the best,
Galin
the Telerik team

[Vladimir]

Hi Galin

Thanks for response. I know I need to attach the function to the OnColumnHidding event, but I am calling grid.get_masterTableView().hideColumn(4) function from clientSide when the page loads. I am calling web service to determine if the user is an Admin of the page or not and hidding column for non-Admin users. Where should I call the hideColumn function?? Btw did u try your solution?? You have an error in aspx page in CodeFile="grid_dummy_data.aspx.cs" it should be CodeFile="grid_default.aspx.cs". Then when I hide column in your test page using contextMenu it resizes correctly the header, but the main grid is not resized at all. And you are using server side OnNeedDS function and I am not, I do everything from Client side, but I thing it is not a problem.

Thank you

Vitalij

[Galin]

Hi Vitalij,

I have tested again the page by hiding the columns with the internal client side API and it works as expected.
I am sending a new modified sample page. Could you check it out and let me know how it goes?

Also, in case the issue persists please give more information about the version of the browser, in which you are testing.

Additionally,  I don't thing the data binding causes the error.

Kind regards,
Galin
the Telerik team

[Vladimir]

Hi Galin

I have tested your solution it is working in Chrome but not in IE8. I tried many combinations, but did not get any positive result. I have attached a file with result in IE8 with a browser version.

I am assuming that I can hide column in OnDataBound event too. I do not need to hide a column on click, but if it is only for testing purposes it is OK.

Thanks

Vitalij

[Galin]

Hello Vitalij,

I have tested again the scenario and it does not work in IE8 - Compatibility Mode, which is similar to IE7. You can use the IE Developer Toolbar (Shortcut F12), which will show you in which browser mode you are.

Also, the problem is a specific browser behavior which does not render correctly the hidden columns. Also it is a known problem, but it is difficult to fix the problem without making a breaking change with the previous versions of RadControls. Anyway, our developers are working on it.

However, I can suggest you this workaround. You can make a dummy ajax postback at every showing/hiding event:

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
 <telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnColumnShown="RefreshGrid" OnColumnHidden="RefreshGrid" />
    </ClientSettings>
 </telerik:RadGrid>
</telerik:RadAjaxPanel>

JS

function RefreshGrid() {
    if($telerik.isIE7)
        $find('RadAjaxPanel1').ajaxRequest('');
}

I hope this helps.

Kind regards,
Galin
the Telerik team

[Sophie]

Was this fixed? Because i can't update my grid, in case user is editing some data in the grid. (rows contains radtabtrip, containing editable grid...) I currently have 2012.3.1308.35 and this is the latest update we can get. 

[Galin]

Hello Sophie,

I am afraid our developers are still working on it and it is not possible to give you exact estimate when the issue will be addressed. As soon as we have any updates on this issues we will update you on the status of this request.

Greetings,
Galin
the Telerik team

[Sophie]

Hey Galin Thanks for the feedback. I'll inform my team about this issue.
Have a good day!
Sophie