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

2 - Top and bottom datapager controls,synced

2 Answers 68 Views
DataPager
This is a migrated thread and some comments may be shown as answers.
Geoff
Top achievements
Rank 1
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">
<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>
                            <!--   Text: -->
                        </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

Sort by
0
Pavlina
Telerik team
answered on 31 May 2012, 08:20 AM
Hi Geoff,

I suggest you examine the project attached in the forum thread below.
http://www.telerik.com/community/forums/aspnet-ajax/listview/radlistview-with-raddatapager.aspx

It demonstrates how the desired functionality can be achieved.

Kind regards,
Pavlina
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
Geoff
Top achievements
Rank 1
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>
Tags
DataPager
Asked by
Geoff
Top achievements
Rank 1
Answers by
Pavlina
Telerik team
Geoff
Top achievements
Rank 1
Share this question
or