IE9 bug, Blank lines inserted on radgrid focus on textbox - IE9

[Aditi]

Hi,

We are having an issue with rendering the radgrid in IE 9 browser. It works fine on IE8. I am using the latest telerik dll's.
The radgrid we have defined has about 50 columns, so we have it wrapped within a div and it has to scroll horizontally. The grid is always designed to be in edit mode. When you Add a New Item, and place focus on any textboxes, blank lines keep getting inserted at the footer of the radgrid.

I am able to replicate this issue in a demo project, but for some reason there is no way I can provide an attachment on this new thread. Please let me know, I can email you the demo project.

I also noticed that if I do not include asp:menu, the issue does not occur, but that is not an option for us. We are using the Menu.

Please let me know how to proceed, I have tried implementing various css based on your forums, none of them have worked so far.

Thanks,
Aditi

CSS to include

.GridDock

{

    overflow-x: auto;

    overflow-y: hidden;                       

}

Page: Default.aspx

<div class="GridDock" id="dvGridWidth" style="width:800px;">

  

          <telerik:RadGrid ID="RadGrid1" runat="server" Width="50%" 

                GridLines="None"

                AutoGenerateColumns="False" 

                PageSize="20"

                AllowPaging="True"

                AllowMultiRowEdit = "True" 

                AllowAutomaticDeletes="True"

                OnNeedDataSource="RadGrid1_NeedDataSource"

                ShowStatusBar="true" 

                Skin="Simple"

                AllowFilteringByColumn="false"  

                OnItemCreated="RadGrid1_ItemCreated"                     

                OnInsertCommand="RadGrid1_InsertCommand"       

                OnItemCommand="RadGrid1_ItemCommand"     

                OnItemDataBound="RadGrid1_OnItemDataBound"

                OnPreRender="RadGrid1_PreRender">

                  

                <GroupingSettings CaseSensitive="false" />                   

                  

                 <MasterTableView DataKeyNames="QuoteItemID" EditMode="InPlace" NoMasterRecordsText=""

                    InsertItemDisplay="Bottom" CommandItemDisplay="Top" CommandItemStyle-Wrap="false">

                      

                    <FooterStyle  HorizontalAlign="Left" /> 

                    <HeaderStyle HorizontalAlign="Left" /> 

                    <ItemStyle Wrap = "false" />

                    <CommandItemTemplate>

                        <asp:LinkButton ID="add" runat="server" Text="Add New Quote Item" CommandName="InitInsert" Height="20px" 

                           Font-Underline="true"  Font-Bold="true"></asp:LinkButton>

                        <asp:LinkButton ID="save" runat="server" Text="Add New Quote Item" CommandName="PerformInsert" Height="20px" 

                           CssClass="underlinedLinkButton" Font-Underline="true" Font-Bold="true" Visible="false"></asp:LinkButton>

                    </CommandItemTemplate>

  

                    <Columns>

  

                        <telerik:GridTemplateColumn UniqueName="ProductID" HeaderText="SKU" SortExpression="ProductID" 

                            ItemStyle-HorizontalAlign="Left" ItemStyle-Wrap="false" HeaderStyle-Width="140px" ItemStyle-Width="140px"> 

                            <ItemTemplate>

                                <telerik:RadTextBox ID="txtVal" Width="140px" 

                                    AutoPostBack="true" runat="server"></telerik:RadTextBox>                                

                            </ItemTemplate>

                            <HeaderTemplate><label style="color:Red; right:2px">*</label><label>SKU</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                                     

                        <telerik:GridTemplateColumn UniqueName="ProductLine" HeaderText="Product Line" SortExpression="ProductLine"

                            ItemStyle-Width="124px" HeaderStyle-Width="124px" >

                         <EditItemTemplate>

                                <telerik:RadTextBox ID="txtProductLine" Width="140px" 

                                    AutoPostBack="true" runat="server"></telerik:RadTextBox>                                

                          </EditItemTemplate>

                        </telerik:GridTemplateColumn>

                        

                       <telerik:GridTemplateColumn UniqueName="Capacity" HeaderText="Capacity" SortExpression="Capacity"

                            ItemStyle-Width="70px" HeaderStyle-Width="85px" FilterControlWidth="50px">

                         

                        <EditItemTemplate>

                           <telerik:RadTextBox ID="txtCapacity" Width="140px" 

                                    AutoPostBack="true" runat="server"></telerik:RadTextBox>                                  

                        </EditItemTemplate>

                        <%--<HeaderTemplate><asp:Label ID="lblReqCapacity" Text="*" CssClass="requiredFieldStyle" runat="server" /></HeaderTemplate>--%>

                        <HeaderTemplate><label style="color:Red; right:2px">*</label><label>Capacity</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                        <telerik:GridTemplateColumn UniqueName="RequestedQty" HeaderText="RequestedQty" ItemStyle-Width="80px" HeaderStyle-Width="100px" > 

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtRequestedQty" runat="server" MaxLength="6" Width="80px" 

                                    DataField="RequestedQty" MinValue="0" MaxValue="999999999" >

                                       

                                    <NumberFormat GroupSeparator="" DecimalDigits="0" AllowRounding="true" 

                                        KeepNotRoundedValue="false"  /> 

                                </telerik:RadNumericTextBox>

                            </EditItemTemplate>  

                            <HeaderTemplate><label style="color:Red">*</label><label>RequestedQty/ Units (K)</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                         <telerik:GridTemplateColumn UniqueName="TAM" HeaderText="TAM" ItemStyle-Width="80px" HeaderStyle-Width="100px"> 

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtTAM" runat="server" MaxLength="6" Width="80px" 

                                    DataField="TAM" MinValue="0" MaxValue="999999999">

                                 <NumberFormat GroupSeparator="" DecimalDigits="0" AllowRounding="true" 

                                        KeepNotRoundedValue="false"  /> 

                                </telerik:RadNumericTextBox>

                            </EditItemTemplate>

                            <HeaderTemplate><label style="color:Red">*</label><label>TAM</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                         <telerik:GridTemplateColumn UniqueName="TAMPercentage" HeaderText="% of TAM" ItemStyle-Width="60px" HeaderStyle-Width="100px" 

                            FilterControlWidth="50px">

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtTAMPercentage" runat="server" Width="60px" CssClass="noBorder" ReadOnly="true" TabIndex="-1" />

                            </EditItemTemplate>  

                        </telerik:GridTemplateColumn>

  

                        <telerik:GridTemplateColumn UniqueName="RequestedPrice" HeaderText="Requested Price" ItemStyle-Width="100px" HeaderStyle-Width="100px"> 

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtRequestedPrice" runat="server" MaxLength="6" Width="100px" 

                                    DataField="RequestedPrice" DataType="System.Decimal" Type="Number" NumberFormat-DecimalDigits="2"  />

                            </EditItemTemplate>

                            <HeaderTemplate><label style="color:Red">*</label><label>Requested Price</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                        <telerik:GridTemplateColumn UniqueName="QtoQChange" HeaderText="Q-Q Change %" ItemStyle-Width="100px" HeaderStyle-Width="100px"> 

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtQtoQChange" runat="server" Width="100px" CssClass="noBorder" ReadOnly="true" TabIndex="-1" />

                            </EditItemTemplate>  

                        </telerik:GridTemplateColumn>

  

                        <telerik:GridTemplateColumn UniqueName="Revenue" HeaderText="Revenue ($,K)" ItemStyle-Width="100px" HeaderStyle-Width="100px"> 

                            <EditItemTemplate>  

                                <telerik:RadNumericTextBox ID="txtRevenue" runat="server" Width="100px" CssClass="noBorder" ReadOnly="true" TabIndex="-1" />

                            </EditItemTemplate>  

                        </telerik:GridTemplateColumn>

                          

                        <telerik:GridTemplateColumn UniqueName="Application" HeaderText="Application" ItemStyle-Width="120px" HeaderStyle-Width="120px" > 

                            <EditItemTemplate>  

                                <telerik:RadTextBox ID="txtApplication" runat="server" Width="120px" DataField="Application"/>

                            </EditItemTemplate>

                            <HeaderTemplate><label style="color:Red">*</label><label>Application</label></HeaderTemplate>

                        </telerik:GridTemplateColumn>

  

                          

                    </Columns>

               </MasterTableView>

            </telerik:RadGrid>               

        </div>

        <asp:Label runat="server" ID="lblTest" Text="Floating Text"></asp:Label>

Page: Default.aspx.cs

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using Telerik.Web.UI;

  

namespace GridBlankLines

{

    public partial class _Default : System.Web.UI.Page

    {

        private static string commandName;

  

        protected void Page_Load(object sender, EventArgs e)

        {

  

        }

  

        protected void RadGrid1_PreRender(object sender, System.EventArgs e)

        {

            if (!IsPostBack)

            {

                foreach (GridItem item in RadGrid1.MasterTableView.Items)

                {

                    if ((item is GridEditableItem) && (!(item is GridHeaderItem)))

                    {

                        GridEditableItem editableItem = item as GridDataItem;

                        editableItem.Edit = true;

                    }

                }

                RadGrid1.Rebind();

            }

  

            //to show the grid in insert mode after insert operation

            if (commandName == "PerformInsert")

            {

                commandName = "";

                RadGrid1.MasterTableView.IsItemInserted = true;

                RadGrid1.Rebind();

  

            }          

  

        }

                

        protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)

        {

            RadGrid1.DataSource = new DataTable();

              

        }

  

        protected void RadGrid1_InsertCommand(object source, GridCommandEventArgs e)

        {

        }

  

        protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)

        {

             

  

        }

  

        protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e)

        {

            if (e.CommandName == RadGrid.InitInsertCommandName)

            {

                commandName = "PerformInsert";

            }

        }

  

        protected void RadGrid1_OnItemDataBound(object sender, GridItemEventArgs e)

        {

              

             

             

        }        

  

    }

}


Site.master page
<body> 

    <form runat="server"> 

    <telerik:RadScriptManager EnablePartialRendering="true" EnableScriptCombine="false" ID="radScriptMgr" runat="server"> 

</telerik:RadScriptManager> 

    <div class="page"> 

        <div class="header"> 

            <div class="title"> 

                <h1> 

                    Demo App 

                </h1> 

            </div> 

               

            <div class="clear hideSkiplink"> 

                <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> 

                    <Items> 

                        <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/> 

                        <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/> 

                    </Items> 

                </asp:Menu> 

            </div> 

        </div> 

        <div class="main"> 

            <asp:ContentPlaceHolder ID="MainContent" runat="server"/> 

        </div> 

        <div class="clear"> 

        </div> 

    </div> 

    <div class="footer"> 

            

    </div> 

    </form> 

</body>

[Pavlina]

Hi,

I suggest that you try replacing asp:Menu with Telerik RadMenu control and see if the described problem in IE9 still persists. You should also remove ItemStyle-Width from your code. Only HeaderStyle-Width should be used for setting column widths. Give these suggestions a try and let me know about the result.

Kind regards,
Pavlina
the Telerik team

[Aditi]

Hi Pavlin,

I tried replacing asp menu with telerik rad menu and removing the itemstyle width from the code. It doesn't resolve the issue.

I need help on this as soon as possible, it is very urgent.

Thanks,
Aditi

[Pavlina]

Hello Aditi,

You can attach your demo project on public site and send us the transfer link. We will examine it and will suggest you further.

Regards,
Pavlina
the Telerik team