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

[Solved] PagerTemplate issues with IE8

1 Answer 80 Views

Grid

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

bdk0172 asked on 24 Nov 2009, 07:23 PM

pagertemplate.JPG

I have the following grid with PagerTemplate set up based on the example at http://demos.telerik.com/aspnet-ajax/grid/examples/programming/pagertemplate/defaultcs.aspx:

telerik:RadGrid ID="grdTicket" Skin="Office2007" Width="100%" AllowSorting="True"

AllowPaging="True" PageSize="50" runat="server" AllowMultiRowSelection="true" OnItemDataBound="grdTicket_ItemDataBound"

OnNeedDataSource="grdTicket_NeedDataSource" OnColumnCreated="grdTicket_ColumnCreated" OnItemCreated="grdTicket_ItemCreated">

<asp:Panel ID="PagerPanel" Style="padding: 6px; line-height: 24px" runat="server">

<telerik:RadComboBox ID="RadComboBox1" DataSource="<%# new object[]{ 5, 10, 15, 20, 25, 30, 35, 40, 45, 50} %>" Skin="Office2007"

Style="margin-right: 20px;" Width="40px" SelectedValue='<%# DataBinder.Eval(Container, "Paging.PageSize") %>'

runat="server" OnClientSelectedIndexChanged="RadComboBox1_SelectedIndexChanged">

</telerik:RadComboBox>

</div>

Displaying page

# (int)DataBinder.Eval(Container, "Paging.CurrentPageIndex") + 1 %>

# DataBinder.Eval(Container, "Paging.PageCount")%>

, items

# (int)DataBinder.Eval(Container, "Paging.FirstIndexInPage") + 1 %>

# (int)DataBinder.Eval(Container, "Paging.LastIndexInPage") + 1 %>

# DataBinder.Eval(Container, "Paging.DataSourceCount")%>

</div>

<asp:Panel runat="server" ID="NumericPagerPlaceHolder" ></asp:Panel>

</asp:Panel>

</PagerTemplate>

<telerik:GridClientSelectColumn Reorderable="False" UniqueName="ClientSelectColumn">

</telerik:GridClientSelectColumn>

<telerik:GridTemplateColumn HeaderText="WTB" DataField="wtbdt" UniqueName="WTBIndicator" Groupable="false" SortExpression="wtbdt">

<asp:Image ID="WTBIndicator" runat="server">

</asp:Image>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="wtbindicator" SortExpression="wtbindicator" Visible="false"></telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</ClientSettings>

telerik:RadGrid>

Everything displays the same as the demo in Firefox, but in IE8, everything is out of position and the width of the radComboBox takes up the whole width of it's container even though a width is specifically set on the combobox. I'm using version 2009.2.826.35. Attached is a screenshot of the positioning issue.

1 Answer, 1 is accepted

answered on 26 Nov 2009, 12:34 PM

Hello Brian,

I am afraid I was not able to reproduce the described problem. Here is my test page:

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

protected void grdTicket_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

DataTable dt = new DataTable();

DataRow dr;

int colsNum = 4;

int rowsNum = 100;

string colName = "Column";

for (int j = 1; j <= colsNum; j++)

{

dt.Columns.Add(String.Format("{0}{1}", colName, j));

}

for (int i = 1; i <= rowsNum; i++)

{

dr = dt.NewRow();

for (int k = 1; k <= colsNum; k++)

{

dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i);

}

dt.Rows.Add(dr);

}

(sender as RadGrid).DataSource = dt;

}

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<title>RadControls for ASP.NET AJAX</title>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<telerik:RadGrid ID="grdTicket" Skin="Office2007" Width="100%" AllowSorting="True"

AllowPaging="True" PageSize="10" runat="server" AllowMultiRowSelection="true"

OnNeedDataSource="grdTicket_NeedDataSource">

<MasterTableView Width="100%" NoMasterRecordsText="No records to display" TableLayout="Fixed"

HeaderStyle-Wrap="true">

<PagerTemplate>

<asp:Panel ID="PagerPanel" Style="padding: 6px; line-height: 24px" runat="server">

<div style="float: left">

<span style="margin-right: 3px;">Page size:</span>

<telerik:RadComboBox ID="RadComboBox1" DataSource="<%# new object[]{ 5, 10, 15, 20, 25, 30, 35, 40, 45, 50} %>"

Skin="Office2007" Style="margin-right: 20px;" Width="40px" SelectedValue='<%# DataBinder.Eval(Container, "Paging.PageSize") %>'

runat="server">

</telerik:RadComboBox>

</div>

<div style="margin: 0px; float: right;">

Displaying page

<%# (int)DataBinder.Eval(Container, "Paging.CurrentPageIndex") + 1 %>

of

<%# DataBinder.Eval(Container, "Paging.PageCount")%>

, items

<%# (int)DataBinder.Eval(Container, "Paging.FirstIndexInPage") + 1 %>

to

<%# (int)DataBinder.Eval(Container, "Paging.LastIndexInPage") + 1 %>

of

<%# DataBinder.Eval(Container, "Paging.DataSourceCount")%>

</div>

<asp:Panel runat="server" ID="NumericPagerPlaceHolder">

</asp:Panel>

</PagerTemplate>

</MasterTableView>

<PagerStyle Mode="NumericPages" />

<ClientSettings>

<Selecting AllowRowSelect="True"></Selecting>

</ClientSettings>

<PagerStyle Mode="NumericPages" />

</telerik:RadGrid>

</form>

</body>

</html>

Best wishes,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.