RadGrid Column sizing in edit mode

4 posts, 0 answers
  1. John
    John avatar
    19 posts
    Member since:
    Aug 2012

    Posted 19 Nov 2018 Link to this post

    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>

     

  2. Eyup
    Admin
    Eyup avatar
    3644 posts

    Posted 22 Nov 2018 Link to this post

    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
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. John
    John avatar
    19 posts
    Member since:
    Aug 2012

    Posted 26 Nov 2018 in reply to Eyup Link to this post

    I took out the StaticClientId and the StaticHeader to no avail.
  4. Eyup
    Admin
    Eyup avatar
    3644 posts

    Posted 29 Nov 2018 Link to this post

    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
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top