RadGrid with resizeToFit Javascript issue

[Dany]

Hi guys, i try to implement the "resizeToFit" javascript method so that i have all my columns automaticly resize at the right size but i have the javascript performance warning all the time (A script on this page is causing Internet Explorer to run slowly,....) and then user have to click No dont stop running that script,

I think my problem is releated to the faq that i have 93 columns in my grid... cause i only have around 50 rows and i am also having a performance issue using the FrozenColumnsCount feature,  there's a lag when im doing a  vertival scolling 


JS Method : 
        function pageLoad()
        {
            var grid = $find('<%=MyGrid.ClientID %>');
            var columns = grid.get_masterTableView().get_columns();
            
            for (var i = 0; i < columns.length; i++) //
            {
                columns[i].resizeToFit();
            }
        }

RadGrid Property : 

<Resizing AllowColumnResize="true" ResizeGridOnColumnResize="true" AllowResizeToFit="true" />


Anybody have an idea ?

Thanks

Dany

[Galin]

Hi Dany,

The resizeToFit and frozen column features are resource-heavy operations, they involves a lot of DOM operation and circles all cells in the column. Therefore the performance issue is expected and it may be a little slower.

However, I highly recommend you to follow the steps described in this help topic.

I hope this helps.

Regards,
Galin
Telerik

[Dany]

In that case, is there's any way to automaticly resize columns base on content, doesn't matter if it's client or server side....

[Galin]

Hi Dany,

I am afraid resizing the columns based on their content cannot be the achieved on server side. The dimensions can be calculated only on client side.

However, I can suggest you to set sufficiently with on every column

<telerik:RadGrid ID="RadGrid1" runat="server"OnNeedDataSource="RadGrid1_NeedDataSource">
    <HeaderStyle Width="150px" />
    <MasterTableView>
        <Columns>
            <telerik:GridBoundColumn DataField="Custom1" HeaderText="Column 1"><HeaderStyle Width="150px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom2" HeaderText="Column 2"><HeaderStyle Width="250px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom3" HeaderText="Column 3"><HeaderStyle Width="50px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom4" HeaderText="Column 4"><HeaderStyle Width="350px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom5" HeaderText="Column 5"><HeaderStyle Width="170px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom6" HeaderText="Column 6"><HeaderStyle Width="80px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom7" HeaderText="Column 7"><HeaderStyle Width="90px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom8" HeaderText="Column 8"><HeaderStyle Width="400px" /></telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Custom9" HeaderText="Column 9"><HeaderStyle Width="150px" /></telerik:GridBoundColumn>
        </Columns>
    </MasterTableView>
    <ClientSettings>
        <Scrolling AllowScroll="true" SaveScrollPosition="true" UseStaticHeaders="true" />
    </ClientSettings>
</telerik:RadGrid>

I hope this helps.

Regards,
Galin
Telerik