column is not aligned while adding/removing columns

[Venkatakrishna]

Hi,

We are using radGrid extensively in our project. We have enabled drag and drop and it also enable the user to add/remove columns. While we remove columns, columns are not alignned and it shows huge space where columns are removed. it got adjusted perfectly if you click " Ungroup " menu. It will be great if it gets adjusted at the moment column is removed. Please see the attached screen shot.

Thanks
Venkat

[Princy]

Hello Venkat,

This can be fixed using a JS code on hooking the client event OnColumnHidden as shown below.
JS:

function onColumnHidden(sender, args)
{
 sender.get_masterTableView().get_element().style.tableLayout = "auto";
 sender.get_masterTableViewHeader().get_element().style.tableLayout = "auto";
 window.setTimeout(function ()
 {
   sender.get_masterTableViewHeader().get_element().style.tableLayout = "fixed";
   sender.get_masterTableView().get_element().style.tableLayout = "fixed";
   }, 1)
 }

Hope this helps.

Regards,
Princy.

[Venkatakrishna]

Hi,

Thanks for your immediate reply.

We tried the code you have provided and it is not working. " onColumnHidden() " function is called perfectly and relevant attributes are set without any issues, but no impact in the UI. Can you send a sample page ?

Thanks
Venkat

[Venkatakrishna]

Hi

Any luck on this ? it will be great if you have perfect fix for this.

Thanks
Venkat

[Princy]

Hello Venkat,

Here I am pasting the complete code that I tried for your reference.
aspx:

<telerik:RadGrid ID="RadGrid1" ShowFooter="true" DataSourceID="SqlDataSource1" AutoGenerateColumns="false" runat="server" EnableHeaderContextMenu="true">
 <MasterTableView TableLayout="Fixed" ClientDataKeyNames="EmployeeID">
   <Columns>
     <telerik:GridBoundColumn DataField="EmployeeID" UniqueName="EmployeeID" HeaderText="EmployeeID"> </telerik:GridBoundColumn>
     <telerik:GridBoundColumn DataField="LastName" UniqueName="LastName" HeaderText="LastName"></telerik:GridBoundColumn>
     <telerik:GridBoundColumn DataField="FirstName" UniqueName="FirstName" HeaderText="FirstName"></telerik:GridBoundColumn>
   </Columns>
 </MasterTableView>
 <ClientSettings AllowDragToGroup="true">
   <ClientEvents OnColumnHidden="onColumnHidden" />
 </ClientSettings>
</telerik:RadGrid>

JS:

function onColumnHidden(sender, args) {
        sender.get_masterTableView().get_element().style.tableLayout = "auto";
        sender.get_masterTableViewHeader().get_element().style.tableLayout = "auto";
        window.setTimeout(function () {
            sender.get_masterTableViewHeader().get_element().style.tableLayout = "fixed";
            sender.get_masterTableView().get_element().style.tableLayout = "fixed";
        }, 1)
}

Thanks,
Princy.