asp.netvb.netrepeaterdatapager

How to use datapager with Repeater


I have a Repeater control and inside my Repeater control I have many controls like gridview, detailsview and some other controls. But now my page become cluttered with controls as it repeats. What I want to achieve is to add the datapager to my page so that you can page through all the data in my controls. for example the first page would contain all items in my repeater with some data, second page all items with different data.

Here is my Repeater control:

<asp:Repeater ID="Repeater1" runat="server"  DataSourceID="SchemeDataSource1">
 <ItemTemplate>
    <table style="border: thin solid #000000"; width: "100%" >
      <tr>
        <td>PRENO
           <asp:Label ID="lblPreno" runat="server" Text='<%# Bind("PRENR") %>'></asp:Label>
            MONTHLY PREMIUM
            <asp:Label ID="lblPrem" runat="server" Text='<%# Bind("PREMIUM") %>'></asp:Label>
        <br />
        </td>
        <td align="right">
         <asp:LinkButton ID="lnkPre" runat="server" 
         ToolTip="Copy Premium To New Scheme" Font-Bold="True" Font-Size="Larger" Visible="true">>></asp:LinkButton>
        </td>
       </tr>

       <tr>
        <td>Relation: [
         <asp:Label ID="lblRel" runat="server" Text='<%# Bind("RELATION") %>'></asp:Label>
        ] UWCODE: [
        <asp:Label ID="lblUw" runat="server" Text='<%# Bind("UWFEECODE") %>'></asp:Label>
       ][
       <asp:Label ID="lblUwDescription" runat="server" Text='<%# Bind("DESCRIPTION") %>'></asp:Label>
       ]
       <br />
       </td>
       </tr>                                                    
       </table>

       <table>
         <tr align="left" valign="top">
          <td align="left">
           <asp:DetailsView ID="dvEarner" runat="server" HeaderText="NO EARNER"
           EmptyDataText="No Results To Display" HeaderStyle-BorderColor="Black"
           HeaderStyle-BorderStyle="Solid" HeaderStyle-BorderWidth="1px"
           BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None"
           BorderWidth="1px" CellPadding="3" CellSpacing="2" EnableViewState="False">
           <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
           <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
           <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center"/>
           <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
           </asp:DetailsView>
                                </td>
                                <td align="left">
                                    <asp:DetailsView ID="dvJVName" runat="server" HeaderText="JV NAME"
                                        HeaderStyle-BorderColor="Black" HeaderStyle-BorderStyle="Solid" HeaderStyle-BorderWidth="1px"
                                        EmptyDataText="JV NAME"
                                        AlternatingRowStyle-BorderStyle="Solid" AlternatingRowStyle-BorderWidth="1px"
                                        BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None"
                                        BorderWidth="1px" CellPadding="3" CellSpacing="2">
                                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                        <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
                                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <EmptyDataRowStyle BackColor="#5D7B9D" ForeColor="White" Font-Bold="true" />
                                    </asp:DetailsView>
                                </td>
                                <td align="left">
                                    <asp:DetailsView ID="DetailsView1" runat="server" HeaderText="%"
                                        HeaderStyle-BorderColor="Black" HeaderStyle-BorderStyle="Solid" HeaderStyle-BorderWidth="1px"
                                        EmptyDataText="%"
                                        AlternatingRowStyle-BorderStyle="Solid" AlternatingRowStyle-BorderWidth="1px"
                                        BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None"
                                        BorderWidth="1px" CellPadding="3" CellSpacing="2">
                                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                        <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
                                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <EditRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" />
                                        <EmptyDataRowStyle BackColor="#5D7B9D" ForeColor="White" Font-Bold="true" />
                                    </asp:DetailsView>
                                </td>
                                <td align="left">
                                    <asp:DetailsView ID="dvProduct" runat="server" HeaderText="PRODUCT DETAILS"
                                        HeaderStyle-BorderColor="Black" HeaderStyle-BorderStyle="Solid" HeaderStyle-BorderWidth="1px"
                                        EmptyDataText="No Results To Display"
                                        AlternatingRowStyle-BorderStyle="Solid" AlternatingRowStyle-BorderWidth="1px"
                                        BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None"
                                        BorderWidth="1px" CellPadding="3" CellSpacing="2">
                                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                        <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
                                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                    </asp:DetailsView>
                                </td>
                                <td align="left">
                                    <asp:DetailsView ID="dvFeeDetails" runat="server" HeaderText="ADDITIONAL FEE DETAILS"
                                        HeaderStyle-BorderColor="Black" HeaderStyle-BorderStyle="Solid" HeaderStyle-BorderWidth="1px"
                                        EmptyDataText="No Results To Display"
                                        AlternatingRowStyle-BorderStyle="Solid" AlternatingRowStyle-BorderWidth="1px"
                                        BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None"
                                        BorderWidth="1px" CellPadding="3" CellSpacing="2">
                                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                        <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
                                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                    </asp:DetailsView>
                                    <br />
                                </td>
                            </tr>
                        </table>

             <table>
                             <tr>
                                <td>
                                    <strong><u>UNDERWRITER DETAILS:</u></strong> 
                                    <asp:GridView ID="grdUWDetails" runat="server" ForeColor="#333333" CellPadding="4" AutoGenerateSelectButton="False">
                                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                        <EmptyDataTemplate>No results to display.</EmptyDataTemplate>
                                    </asp:GridView>
                                    <br />
                                    <hr />
                                </td>
                            </tr>
                        </table>
        </ItemTemplate>
    </asp:Repeater>

To bind my controls in my repeater:

Private Sub Repeater1_ItemDataBound(ByVal sender As Object, ByVal e As     System.Web.UI.WebControls.RepeaterItemEventArgs) Handles Repeater1.ItemDataBound
If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then
  Dim strPreno As String = DirectCast(e.Item.FindControl("lblPreno"), Label).Text

  Dim dv As DetailsView = DirectCast(e.Item.FindControl("dvEarner"), DetailsView)
  dv.DataSource = fnLoadPremiums(strPreno)
  dv.DataBind()

  Dim dv1 As DetailsView = DirectCast(e.Item.FindControl("dvProduct"), DetailsView)
  dv1.DataSource = fnLoadProduct(strPreno)
  dv1.DataBind()

  Dim dv2 As DetailsView = DirectCast(e.Item.FindControl("dvFeeDetails"), DetailsView)
  dv2.DataSource = fnLoadFeeDetails(strPreno)
  dv2.DataBind()

  Dim grd As GridView = DirectCast(e.Item.FindControl("grdUWDetails"), GridView)

  grd.DataSource = fnLoadGrid(strPreno)
  grd.DataBind()
End If
End Sub

Or if you have any ideas how to achieve this it would be much appreciated.

I have used the datapager but I got this error: Control 'Repeater1' does not implement IPageableItemContainer. Then I did some researched about this the datapager only works with listview. So now I want the same method as the datapager but nor sure how to achieve this. Any Ideas?


Solution

  • solved the issue is going to use <ajaxToolkit:Accordion></ajaxToolkit:Accordion> This way I can uses panes to hide repeated controls.