RadGrid Column sizing in edit mode

[John]

I have a radgrid I am trying to edit.  When It goes to edit mode all the columns are pushed to the left side of the row.  The edit portion displays correctly but the data row that is being edited has all the columns pushed to the left side of the grid.

Here is the code for the aspx page.  I will attach a before and after edit button is pushed as attached files.  I have tried column editors.  Tried adjusting them from code behind.  All the things I have found on the web to no avail.  I have spent way too much time trying to figure this out and the client is getting restless.  Any help would be appreciated.

<div id="divRadGrid">
                    <telerik:RadGrid
                        runat="server"
                        ID="rgLOIs"
                        DataSourceID="sdsLOIs"
                        ClientIDMode="Static"
                        ShowHeader="true"
                        width ="100%"
                        AllowAutomaticInserts="false"
                        AllowAutomaticDeletes="false"
                        AutoGenerateEditColumn="false"
                        AutoGenerateColumns="false"
                        EditItemStyle-CssClass="noPrint"
                        EditItemStyle-Width="20%"
                        EditRowStyle-Width="5%">
                        <ClientSettings Scrolling-UseStaticHeaders="true" Scrolling-AllowScroll="true"></ClientSettings>
                        <MasterTableView Width="100%" TableLayout="Fixed">
                            <EditFormSettings >
                                <FormStyle BackColor="#99ccff" />
                            </EditFormSettings>
                            <Columns>
                                <telerik:GridEditCommandColumn UniqueName="GridEditColumn"  ></telerik:GridEditCommandColumn>
                                <telerik:GridBoundColumn DataField="AuditLoiId" Display="false" ReadOnly="true" />
                                <telerik:GridBoundColumn DataField="LoiId" Display="false" ReadOnly="true"/>
                                <telerik:GridBoundColumn UniqueName="LoiCode" DataField="LoiCode" ReadOnly="true" ItemStyle-CssClass="maximize" HeaderStyle-Wrap="true"/>
                                <telerik:GridBoundColumn UniqueName="LoiText" DataField="LoiText" HeaderStyle-CssClass="form-control" ReadOnly="true" ColumnEditorID="GridTextBoxColumnEditor1" ItemStyle-CssClass="maximize" HeaderText="LOI"   HeaderStyle-Width="20%" HeaderStyle-Wrap="true"/>
                                <telerik:GridTemplateColumn UniqueName="CBResponse" HeaderText="Yes/No" ItemStyle-CssClass="maximize"  HeaderStyle-Width="5%">
                                    <ItemTemplate>
                                        <asp:RadioButtonList runat="server" ID="rblItemResponse" Width="100%" DataValueField="CBResponse" Value='<%# Eval("CBResponse") %>'>
                                            <asp:ListItem Text="Yes" Value="1"></asp:ListItem>
                                            <asp:ListItem Text ="No" Value="0"></asp:ListItem>
                                        </asp:RadioButtonList>
                                    </ItemTemplate>
                                    <EditItemTemplate>
                                        <asp:RadioButtonList runat="server" ID="rblEditResponse" Width="100%" DataValueField="CBResponse" >
                                            <asp:ListItem Text="Yes" Value="1"></asp:ListItem>
                                            <asp:ListItem Text ="No" Value="0"></asp:ListItem>
                                        </asp:RadioButtonList>
                                    </EditItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn UniqueName="FacilityStatus"  ItemStyle-CssClass="maximize"  HeaderStyle-Width="15%"
                                    HeaderText="Status(Facility)">
                                    <EditItemTemplate>
                                        <asp:DropDownList ID="ddlEditFacilityStatus" runat="server" Width="100%" DataSourceID="sdsLoiStatus" DataTextField="LoiStatusText" DataValueField="LoiStatusId" SelectedValue='<%# Bind("FacilityStatus") %>'></asp:DropDownList>
                                    </EditItemTemplate>
                                    <ItemTemplate>
                                        <asp:DropDownList ID="ddlItemFacilityStatus" runat="server" Width="100%" DataSourceID="sdsLoiStatus" DataTextField="LoiStatusText" DataValueField="LoiStatusId" SelectedValue='<%# Eval("FacilityStatus") %>'></asp:DropDownList>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn UniqueName ="FacilityComments" ItemStyle-CssClass="maximize" HeaderStyle-Width="20%" HeaderText="Facility Comments">
                                    <EditItemTemplate>
                                        <asp:TextBox ID="txtEditFacilityComments" runat="server" Width="100%" Text='<%# Bind("FacilityComments") %>'></asp:TextBox>
                                    </EditItemTemplate>
                                    <ItemTemplate>
                                        <asp:TextBox ID="txtItemFacilityComments" runat="server" Width="100%" Text='<%# Eval("FacilityComments") %>'></asp:TextBox>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn UniqueName="AuditorStatus" ItemStyle-CssClass="maximize"   HeaderStyle-Width="15%"
                                    HeaderText="Status(Auditor)" DataField="AuditorStatus">
                                    <EditItemTemplate>
                                        <asp:DropDownList ID="ddlEditAuditorStatus" runat="server" Width="100%" DataSourceID="sdsLoiStatus" DataTextField="LoiStatusText" DataValueField="LoiStatusId" SelectedValue='<%# Bind("AuditorStatus") %>'></asp:DropDownList>
                                    </EditItemTemplate>
                                    <ItemTemplate>
                                        <asp:DropDownList ID="ddlItemAuditorStatus" runat="server" Width="100%" DataSourceID="sdsLoiStatus" DataTextField="LoiStatusText" DataValueField="LoiStatusId" SelectedValue='<%# Eval("AuditorStatus") %>'></asp:DropDownList>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn UniqueName ="AuditorComments" ItemStyle-CssClass="maximize"  HeaderStyle-Width="20%" HeaderText="Facility Comments">
                                    <EditItemTemplate>
                                        <asp:TextBox ID="txtEditAuditorComments" runat="server" Width="100%" Text='<%# Bind("AuditorComments") %>'></asp:TextBox>
                                    </EditItemTemplate>
                                    <ItemTemplate>
                                        <asp:TextBox ID="txtItemAuditorComments" runat="server" Width="100%" Text='<%# Eval("AuditorComments") %>'></asp:TextBox>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                            </Columns>
                        </MasterTableView>
                    </telerik:RadGrid>

 

[Eyup]

Hello John,

You can remove ClientIDMode property and see whether this will resolve the issue:
https://docs.telerik.com/devtools/aspnet-ajax/general-information/troubleshooting/general-troubleshooting#setting-clientidmode-property-to-static-breaks-the-telerik-controls-functionality

Also, you can temporarily remove the UseStaticHeaders property:
https://www.telerik.com/support/kb/aspnet-ajax/grid/details/misaligned-columns-in-radgrid-with-scrolling-enabled

I hope these steps will help you troubleshoot the issue.

Regards,
Eyup
Progress Telerik

[John]

I took out the StaticClientId and the StaticHeader to no avail.

[Eyup]

Hello John,

I suggest that you open a formal support ticket and send us a very basic runnable web site demonstrating the problematic issue. This will allow us to replicate the issue locally and provide more accurate and precise suggestions.

Regards,
Eyup
Progress Telerik