resizeToFit() in FireFox

[Wendelstam]

Hi.

I am using this JS function on the client to resize the columns in a RadGrid located on a RadMultiPage. It works on FireFox as long as the Grid is "visible" i.e. in the active tab. If I do a post back from another Tab and then change back to the tab containing the Grid the MasterTableView has lost its width and the columns/headers are rendered inside the 0 px MasterTableView so they are not visible but they are there if i look at the html.

It works great on Chrome and IE but not on Firefox. Any ideas?

function ResizeGrid() {
    var grid = $find("<%= RadGrid1.ClientID %>");
    var masterTableView = grid.get_masterTableView();
    if (masterTableView) {
        var columns = masterTableView.get_columns();
        for (var i = 0; i < columns.length; i++) {
            columns[i].resizeToFit();
        }
    }
}

BR
Johan

[Venelin]

Hi Johan,

Could you please try to set the RenderSelectedPageOnly property of RadMultiPage to true. Here is my test setup and everything works as expected:

ASPX:

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
    <telerik:RadTabStrip runat="server" ID="RadTabStrip1" MultiPageID="MultiPage1" AutoPostBack="true">
        <Tabs>
            <telerik:RadTab Text="Tab1" Selected="true"></telerik:RadTab>
            <telerik:RadTab Text="Grid"></telerik:RadTab>
        </Tabs>
    </telerik:RadTabStrip>
    <telerik:RadMultiPage runat="server" ID="MultiPage1" RenderSelectedPageOnly="true" >
        <telerik:RadPageView runat="server" ID="Tab1View"></telerik:RadPageView>
        <telerik:RadPageView runat="server" ID="GridView">
            <telerik:RadGrid runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource" AllowPaging="true">
                <MasterTableView></MasterTableView>
                <ClientSettings>
                    <Scrolling AllowScroll="true" UseStaticHeaders="true"/>
                    <Resizing AllowColumnResize="true" AllowResizeToFit="true"/>
                </ClientSettings>
                <PagerStyle AlwaysVisible="true" />
            </telerik:RadGrid>
        </telerik:RadPageView>
    </telerik:RadMultiPage>
</telerik:RadAjaxPanel>

JavaScript:

function pageLoad(){
    ResizeGrid();
}
function ResizeGrid() {
    var grid = $find("<%= RadGrid1.ClientID %>");
    if (!grid) return;
    var masterTableView = grid.get_masterTableView();
    if (masterTableView) {
        var columns = masterTableView.get_columns();
        for (var i = 0; i < columns.length; i++) {
            //debugger;
            columns[i].resizeToFit();
        }
    }
}

Please also note that when you encounter an issue it's a good idea to provide your code so we can review it and test with your settings.

Regards,
Venelin
Telerik