This is a migrated thread and some comments may be shown as answers.

RadGrid Row Data Overflow in IE8

6 Answers 75 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Vargis
Top achievements
Rank 2
Vargis asked on 08 Feb 2013, 12:02 PM
Totally fed-up Team Telerik.
Just check the attachment please.

Please remind if you giving any solution please confirm it will not affect other telerik controls.

Presently we are using these Global CSS properties


html{overflow:hidden;}
html, body, form {width:auto; height:auto;}
html, body {margin:0; padding:0;}
html, body{width:100%!important; height:100%!important;}
form {width:100%!important; height:96%!important;}
html, body, form, span, label, td, th{font-family:Tahoma, Arial!important; font-size:11px!important;}
body {overflow:auto;}

h2, h3 {margin:3px 0 7px 0}
h2.feldsetLegend {font-size:12px; border-bottom:solid 1px #ccc; margin:0px 0 10px 0; padding-bottom:2px}
table{border-collapse:collapse;}

span, label {font-family:Tahoma, Arial, Verdana!important;}
h2, h3 {margin:3px 0 7px 0}
hr {border:none;border-bottom:solid 1px #999}
h2.feldsetLegend {font-size:12px; border-bottom:solid 1px #ccc; margin:0px 0 10px 0; padding-bottom:2px}


fieldset {padding:0px 5px 7px 5px;}
legend {font-weight:bold!important; font-size:11px!important}
table{width:100%;}

a.rwIcon{background-image: none !important;}
.rwTitlebarControls td {width:auto!important}

----------------------------------------------------------------------------------------------------
Thanks in Advance

6 Answers, 1 is accepted

Sort by
0
Vargis
Top achievements
Rank 2
answered on 11 Feb 2013, 06:02 AM
Team Telerik please give a fast solution.
Its going to release.

Now we found another major issue in IE8
RadGrid Header Vertical Line(Border) and Row vertical lines(Border) are not correct vertically ...

Please refer the attachec screen shot
Data overflow is also shown in that Screen shot
0
Angel Petrov
Telerik team
answered on 13 Feb 2013, 11:51 AM
Hello Vargis,

It would be hard to reproduce the problem without the full content of your page. Could you please send us your markup and CSS or a page in which the problem can be replicated? I suppose that somewhere you have set position relative for the MasterTableView. If this is the case please try setting:
.rgDataDiv
   {
       position: relative;   
   }
Also if you are using static headers and the width of the column is being set please remove the width from one of the columns so the grid can recalculate the alignment. In attachments you can find the project in which I have tried to reproduce the described issue.

Regards,
Angel Petrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Vargis
Top achievements
Rank 2
answered on 13 Feb 2013, 01:29 PM
Actually I had already included this class and property
.rgDataDiv
   {
       position: relative;   
   }

I have an outer div container with this css property.
0
Angel Petrov
Telerik team
answered on 15 Feb 2013, 04:13 PM
Hi Vargis,

Please provide a page in which this problem replicates. It would be hard to determine what is causing this problem without having a full view over your setup.

Kind regards,
Angel Petrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
KARTHIK
Top achievements
Rank 1
answered on 01 Oct 2013, 12:40 PM
Team Telerik,
  I have issue in Radgrid edit pop up with parent/child relation ship
attached screenshot shows the Grid values shows in edit pop up.

please provide solution as soon as possible

Below is aspx for radgrid
<telerik:RadGrid ID="RadGrid1" runat="server" AllowSorting="True" AllowMultiRowSelection="False"
            Skin="Office2007" GridLines="None" OnItemDataBound="RadGrid1_ItemDataBound" OnInsertCommand="RadGrid2_InsertCommand"
            OnItemCommand="RadGrid2_ItemCommand" ShowStatusBar="true" AllowFilteringByColumn="True"
            AllowPaging="True" PageSize="15" OnUpdateCommand="RadGrid2_OnUpdateCommand" OnNeedDataSource="RadGrid1_NeedDataSource"
            OnDetailTableDataBind="RadGrid1_DetailTableDataBind" AutoGenerateColumns="false">
            <MasterTableView Width="100%" DataKeyNames="TabID" AllowMultiColumnSorting="True"
                Name="Tabs" CommandItemDisplay="top" EditMode="PopUp"
                PageSize="15">
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="TabID" Name="Links" Width="100%" CommandItemDisplay="top"
                        EditMode="PopUp">
                        <Columns>
                            <telerik:GridEditCommandColumn>
                            </telerik:GridEditCommandColumn>
                            <telerik:GridBoundColumn UniqueName="LinkID" ItemStyle-ForeColor="White" ItemStyle-Width="20px"
                                ItemStyle-Wrap="false" Visible="false" HeaderText="" DataField="LinkID">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="TabID" HeaderText="TabID" DataField="TabID"
                                Visible="false">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Name" HeaderText="Name" DataField="Name" Visible="true"
                                FilterControlWidth="150px">
                                <ItemStyle Width="150px" />
                                <HeaderStyle Width="150px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Order" HeaderText="Order" DataField="Order"
                                FilterControlWidth="30px" Visible="true">
                                <ItemStyle Width="30px" />
                                <HeaderStyle Width="30px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="status" HeaderText="status" DataField="status"
                                Visible="false">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Description" HeaderText="Description" DataField="Description"
                                FilterControlWidth="150px">
                                <ItemStyle Width="150px" />
                                <HeaderStyle Width="150px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="FileName" HeaderText="File Name" DataField="FileName">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="FolderName" HeaderText="Folder Name" DataField="FolderName">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Path" HeaderText="Path" DataField="Path">
                                <ItemStyle Width="150px" />
                                <HeaderStyle Width="150px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Parent" HeaderText="Parent" DataField="Parent"
                                Visible="true">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="HyperLink" HeaderText="HyperLink" DataField="HyperLink"
                                Visible="false">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="QuickAccess" HeaderText="QuickAccess" DataField="QuickAccess">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Display" HeaderText="Display" DataField="Display"
                                Visible="false">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="ContextUrl" HeaderText="ContextUrl" DataField="ContextUrl">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Target" HeaderText="Target" DataField="Target">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="ReportType" HeaderText="ReportType" DataField="ReportType">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="FormulaFileName" HeaderText="FormulaFileName"
                                DataField="FormulaFileName">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="FormulaFolderName" HeaderText="FormulaFolderName"
                                DataField="FormulaFolderName">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="ReportTemplate" HeaderText="ReportTemplate"
                                DataField="ReportTemplate">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="ReportServerConfig" HeaderText="ReportServerConfig"
                                DataField="ReportServerConfig">
                                <ItemStyle Width="50px" />
                                <HeaderStyle Width="50px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridButtonColumn CommandName="Delete" Text="Delete" UniqueName="Delete"
                                ConfirmText="Are you sure want to delete the selected LineItem?" ConfirmDialogType="Classic"
                                ConfirmTitle="Delete" ButtonType="ImageButton" ImageUrl="~/Images/delete.png" />
                        </Columns>
                        <EditFormSettings InsertCaption="Add New Record" CaptionFormatString="Edit " CaptionDataField="Tabid"
                            PopUpSettings-Height="380" EditFormType="Template" PopUpSettings-Modal="true"
                            PopUpSettings-Width="560">
                            <FormTemplate>
                                <table id="Table1"  cellspacing="2" cellpadding="1" width="100%" border="0" rules="none"
                        style="border-collapse: collapse;">
                                    <tr>
                                        <td>
                                            <table id="Table2" cellspacing="1" cellpadding="1" border="0">
                                                <tr>
                                                    <td>
                                                        Name:
                                                    </td>
                                                    <td colspan="3">
                                                        <asp:TextBox ID="txtName" Height="20px" Text='<%# Bind( "Name") %>' runat="server"
                                                            Width="420px" TextMode="MultiLine">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Description:
                                                    </td>
                                                    <td colspan="3">
                                                        <asp:TextBox ID="txtDescription" Height="20px" Text='<%# Bind( "Description") %>'
                                                            runat="server" TextMode="MultiLine" Width="420px">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        File Name:
                                                    </td>
                                                    <td colspan="3">
                                                        <asp:TextBox ID="txtFilename" Height="20px" Text='<%# Bind( "Filename") %>' runat="server"
                                                            Width="420px" TextMode="MultiLine">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Path:
                                                    </td>
                                                    <td colspan="3">
                                                        <asp:TextBox ID="txtPath" Height="20px" Text='<%# Bind( "Path") %>' runat="server"
                                                            Width="420px" TextMode="MultiLine">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Order :
                                                    </td>
                                                    <td>
                                                        <telerik:RadNumericTextBox ID="txtOrder" Text='<%# Bind( "Order") %>' runat="server"
                                                            Width="150px" NumberFormat-DecimalDigits="0">
                                                        </telerik:RadNumericTextBox>
                                                    </td>
                                                    <td>
                                                        Folder Name:
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtFolderName" Text='<%# Bind( "FolderName") %>' runat="server"
                                                            Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Quick Access :
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtQuickAccess" Text='<%# Bind( "QuickAccess") %>' runat="server"
                                                            Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                    <td>
                                                        Context Url:
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtContextUrl" Text='<%# Bind( "ContextUrl") %>' runat="server"
                                                            Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Parent :
                                                    </td>
                                                    <td>
                                                        <telerik:RadNumericTextBox ID="txtParent" Text='<%# Bind( "Parent") %>' runat="server"
                                                            Width="150px" NumberFormat-DecimalDigits="0">
                                                        </telerik:RadNumericTextBox>
                                                    </td>
                                                    <td>
                                                        Report Type:
                                                    </td>
                                                    <td>
                                                        <telerik:RadNumericTextBox ID="txtReportType" Text='<%# Bind( "ReportType") %>' runat="server"
                                                            Width="150px" NumberFormat-DecimalDigits="0">
                                                        </telerik:RadNumericTextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Target :
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtTarget" Text='<%# Bind( "Target") %>' runat="server" Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                    <td>
                                                        Formula&nbsp;FileName:
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtFormulaFileName" Text='<%# Bind( "FormulaFileName") %>' runat="server"
                                                            Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Formula&nbsp;FolderName :
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtFormulaFolderName" Text='<%# Bind( "FormulaFolderName") %>' runat="server">
                                                        </asp:TextBox>
                                                    </td>
                                                    <td>
                                                        Report&nbsp;Template:
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtReportTemplate" Text='<%# Bind( "ReportTemplate") %>' runat="server"
                                                            Width="150px">
                                                        </asp:TextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        Report ServerConfig :
                                                    </td>
                                                    <td>
                                                        <asp:TextBox ID="txtReportServerConfig" Text='<%# Bind( "ReportServerConfig") %>'
                                                            Width="150px" runat="server">
                                                        </asp:TextBox>
                                                    </td>
                                                    <td>
                                                    </td>
                                                    <td>
                                                        <asp:CheckBox ID="chkhyperlink" Text="Hyperlink" runat="server" />
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                    </td>
                                                    <td>
                                                        <asp:CheckBox ID="chkdisplay" Text="Display" runat="server" />
                                                    </td>
                                                    <td>
                                                    </td>
                                                    <td>
                                                        <asp:CheckBox ID="chkstatus" Text="Status" runat="server" />
                                                    </td>
                                                </tr>
                                            </table>
                                            <table style="width: 100%">
                                                <tr>
                                                    <td align="Center" colspan="2">
                                                        <asp:Button ID="Button31" Text='<%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>'
                                                            runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'>
                                                        </asp:Button>&nbsp;
                                                        <asp:Button ID="Button41" Text="Cancel" runat="server" CausesValidation="False" CommandName="Cancel">
                                                        </asp:Button>
                                                    </td>
                                                    <td>
                                                        <asp:Label ID="lblerror1" Font-Size="Medium" Font-Bold="true" ForeColor="Red" runat="server"
                                                            Text=""></asp:Label>
                                                    </td>
                                                </tr>
                                            </table>
                            </FormTemplate>
                        </EditFormSettings>
                    </telerik:GridTableView>
                </DetailTables>
                <Columns>
                    <telerik:GridEditCommandColumn>
                    </telerik:GridEditCommandColumn>
                    <telerik:GridBoundColumn UniqueName="TabID" Visible="false" HeaderText="TabID" DataField="TabID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="TabName" HeaderText="Tab Name" DataField="TabName"
                        Visible="true">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="Order" HeaderText="Order" DataField="Order"
                        Visible="true">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="status" HeaderText="status" DataField="status"
                        Visible="false">
                    </telerik:GridBoundColumn>
                    <telerik:GridButtonColumn CommandName="Delete" Text="Delete" UniqueName="Delete"
                        ConfirmText="Are you sure want to delete the selected LineItem?" ConfirmDialogType="Classic"
                        ConfirmTitle="Delete" ButtonType="ImageButton" ImageUrl="~/Images/delete.png">
                    </telerik:GridButtonColumn>
                </Columns>
                <EditFormSettings InsertCaption="Add New Record" CaptionFormatString="Edit " CaptionDataField="Tabid"
                    PopUpSettings-Height="180" EditFormType="Template" PopUpSettings-Modal="true"
                    PopUpSettings-Width="230">
                    <FormTemplate>
                        <table id="Table1" cellspacing="1" cellpadding="1" border="0"  cellspacing="2" cellpadding="1" width="100%" border="0" rules="none"
                        style="border-collapse: collapse;">
                            <tr>
                                <td>
                                    <table id="Table2" cellspacing="1" cellpadding="1" border="0">
                                        <tr>
                                            <td>
                                                Tab&nbsp;Name:
                                            </td>
                                            <td>
                                                <asp:TextBox ID="txttabname" Text='<%# Bind( "TabName") %>' runat="server">
                                                </asp:TextBox>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                Order :
                                            </td>
                                            <td>
                                                <telerik:RadNumericTextBox ID="txtOrdertab" Text='<%# Bind( "Order") %>' runat="server"
                                                    Width="150px" NumberFormat-DecimalDigits="0">
                                                </telerik:RadNumericTextBox>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                            </td>
                                            <td>
                                                <asp:CheckBox ID="chkstatustab" Text="Status" runat="server" />
                                            </td>
                                        </tr>
                                        <table style="width: 100%">
                                            <tr>
                                                <td align="Center" colspan="2">
                                                    <asp:Button ID="Button3" Text='<%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>'
                                                        runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'>
                                                    </asp:Button>&nbsp;
                                                    <asp:Button ID="Button4" Text="Cancel" runat="server" CausesValidation="False" CommandName="Cancel">
                                                    </asp:Button>
                                                </td>
                                                <td>
                                                    <asp:Label ID="lblerror" Font-Size="Medium" Font-Bold="true" ForeColor="Red" runat="server"
                                                        Text=""></asp:Label>
                                                </td>
                                            </tr>
                                        </table>
                    </FormTemplate>
                </EditFormSettings>
            </MasterTableView>
        </telerik:RadGrid>


Thanks & regards
Karthik.A
0
Angel Petrov
Telerik team
answered on 04 Oct 2013, 09:53 AM
Hi Karthik,

Using the code provided I was able to reproduce the problem. It was due to invalid HTML. The first tables in the FormTemplates are not closed properly thus the HTML is not rendered correctly. By deleting the most outer tables I was able to resolve the problem. Please apply the appropriate changes on your side and test whether this resolves the issue.

Regards,
Angel Petrov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Grid
Asked by
Vargis
Top achievements
Rank 2
Answers by
Vargis
Top achievements
Rank 2
Angel Petrov
Telerik team
KARTHIK
Top achievements
Rank 1
Share this question
or