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

2 - Top and bottom datapager controls,synced

2 Answers 158 Views

DataPager

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

Geoff asked on 30 May 2012, 03:33 PM

I'm trying to add my datapager on both the top and bottom of the page. I figured it would be just adding a second RadDataPager with a different ID set to the same PageControlID, but I get an error when I test the page. Here is what I have markup wise, this is just one controller.

How would I add that second control in and have it appear at the top of the page?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadDataPager.aspx.cs" Inherits="JJPro.Web.RadDataPager" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head runat="server">

<title></title>

</head>

<body>

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

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadListView1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadListView1" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" MinDisplayTime="0" />

<telerik:RadListView ID="RadListView1" Width="97%" AllowPaging="True" runat="server"

AllowSorting="true" ItemPlaceholderID="ProductsHolder" DataKeyNames="GUID" DataSourceID="TestData"

AllowMultiFieldSorting="True" BorderStyle="None" EnableEmbeddedBaseStylesheet="False">

<LayoutTemplate>

<!-- Set the id of the wrapping container to match the CLIENT ID of the RadListView control to display the ajax loading panel

In case the listview is embedded in another server control, you will need to append the id of that server control -->

<fieldset style="width: 740px;" id="RadListView1">

<legend></legend>

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

<table cellpadding="0" cellspacing="0" width="100%">

<tr>

<td>

<telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"

PageSize="9" AllowSEOPaging="False">

<Fields>

<telerik:RadDataPagerButtonField FieldType="FirstPrev" />

<telerik:RadDataPagerButtonField FieldType="Numeric" />

<telerik:RadDataPagerButtonField FieldType="NextLast" />

<telerik:RadDataPagerPageSizeField PageSizeText="Page size: " PageSizes="3,6,9,12,15"

PageSizeComboWidth="50" />

<telerik:RadDataPagerGoToPageField CurrentPageText="Page: " TotalPageText="of" SubmitButtonText="Go"

TextBoxWidth="30" />

<telerik:RadDataPagerTemplatePageField>

<PagerTemplate>

<div style="float: right">

<b>Items

<asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />

to

<asp:Label runat="server" ID="TotalPagesLabel" Text="<%# Container.Owner.StartRowIndex+Container.Owner.PageSize %>" />

of

<asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />

<br />

</b>

</div>

</PagerTemplate>

</telerik:RadDataPagerTemplatePageField>

</Fields>

</telerik:RadDataPager>

</td>

</tr>

</table>

</fieldset>

</LayoutTemplate>

<ItemTemplate>

<div style="float: left;">

<table cellpadding="0" cellspacing="0" style="width: 230px; height: 100px">

<tr>

<td style="width: 20%;">

</td>

<td style="width: 80%; padding-left: 5px;">

<%--# Eval("GUID") --%>

</td>

</tr>

<tr>

<td>

</td>

<td style="width: 80%; padding-left: 5px;">

<asp:Image ID="ProductImage" OnClick="" runat="server" Width="200" Height="200" ImageUrl='<%# Eval("ImageURL", "Images/MockUp/{0}") %>' />

</td>

</tr>

<tr>

<td>

</td>

<td style="width: 80%; padding-left: 5px; text-align: center; font-weight: bold;">

<%# Eval("ProductText") %>

</td>

</tr>

<tr>

</tr>

<tr>

<td>

<hr />

</td>

<td>

<hr />

</td>

</tr>

</table>

</div>

</ItemTemplate>

</telerik:RadListView>

<asp:SqlDataSource ID="TestData" runat="server" ConnectionString="<%$ ConnectionStrings:dev_gmyersConnectionString %>"

SelectCommand="SELECT * FROM [DataPagerTestData2]"></asp:SqlDataSource>

<br />

</form>

</body>

</html>

2 Answers, 1 is accepted

answered on 31 May 2012, 03:24 PM

I'm not sure why I couldn't get it to work the first time around, because I did it basically the same way as the example shown. But it does work now! Here is the markup for future ponderers :)

<fieldset style="width: 740px;" id="Fieldset1">

<legend></legend>

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

<table cellpadding="0" cellspacing="0" width="100%">

<tr>

<td>

<telerik:RadDataPager ID="RadDataPager2" runat="server" PagedControlID="RadListView1"

PageSize="9" AllowSEOPaging="False" EnableEmbeddedSkins="False" EnableEmbeddedBaseStylesheet="False">

<Fields>

<telerik:RadDataPagerButtonField FieldType="FirstPrev" />

<telerik:RadDataPagerButtonField FieldType="Numeric" />

<telerik:RadDataPagerButtonField FieldType="NextLast" />

<telerik:RadDataPagerPageSizeField PageSizeText="Page size: " PageSizes="3,6,9,12,15"

PageSizeComboWidth="50" />

<telerik:RadDataPagerGoToPageField CurrentPageText="Page: " TotalPageText="of" SubmitButtonText="Go"

TextBoxWidth="30" />

<telerik:RadDataPagerTemplatePageField>

<PagerTemplate>

<div style="float: right">

<b>Items

<asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />

to

<asp:Label runat="server" ID="TotalPagesLabel" Text="<%# Container.Owner.StartRowIndex+Container.Owner.PageSize %>" />

of

<asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />

<br />

</b>

</div>

</PagerTemplate>

</telerik:RadDataPagerTemplatePageField>

</Fields>

</telerik:RadDataPager>

</td>

</tr>

</table>

</fieldset>

<fieldset style="width: 740px;" id="RadListView1">

<legend></legend>

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

<table cellpadding="0" cellspacing="0" width="100%">

<tr>

<td>

<telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"

PageSize="9" AllowSEOPaging="False">

<Fields>

<telerik:RadDataPagerButtonField FieldType="FirstPrev" />

<telerik:RadDataPagerButtonField FieldType="Numeric" />

<telerik:RadDataPagerButtonField FieldType="NextLast" />

<telerik:RadDataPagerPageSizeField PageSizeText="Page size: " PageSizes="3,6,9,12,15"

PageSizeComboWidth="50" />

<telerik:RadDataPagerGoToPageField CurrentPageText="Page: " TotalPageText="of" SubmitButtonText="Go"

TextBoxWidth="30" />

<telerik:RadDataPagerTemplatePageField>

<PagerTemplate>

<div style="float: right">

<b>Items

<asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />

to

<asp:Label runat="server" ID="TotalPagesLabel" Text="<%# Container.Owner.StartRowIndex+Container.Owner.PageSize %>" />

of

<asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />

<br />

</b>

</div>

</PagerTemplate>

</telerik:RadDataPagerTemplatePageField>

</Fields>

</telerik:RadDataPager>

</td>

</tr>

</table>

</fieldset>