web-dev-qa-db-fra.com

Comment utiliser la pagination avec le contrôle Repeater dans ASP.NET?

<asp:Repeater ID="RepCourse" runat="server">

  <ItemTemplate>

    <div style="width:400px"></div>

    <div class="course" style="float: left; margin-left: 100px; margin-top: 100px">

      <div class="image">
        <asp:Image ID="imgteacher" runat="server" Height="150" Width="248" ImageUrl='<%# "ShowImage.ashx?id="+ DataBinder.Eval(Container.DataItem, "CourseID") %>'/>
      </div>

      <div style="margin-left: 3px; width: 250px">
        <div class="name">
          <a href="#"><asp:Label runat="server" ID="lblname" Text='<%#Eval("CourseName") %>'></asp:Label></a>
        </div>
        <div style="height: 13px"></div>
        <div id="teacher">
          <a href="#"><%#Eval("UserName") %> </a>
        </div>
      </div>

      <div style="height: 4px"></div>

      <div class="date">
        <div id="datebegin">
          <asp:Label ID="lbldatebegin" runat="server" Text='<%#Eval("BeginDate") %>'></asp:Label>
        </div>
        <div id="dateend">
          <asp:Label ID="lbldateend" runat="server" Text='<%#Eval("ClosingDate") %>'></asp:Label>
        </div>
      </div>

    </div>

  </ItemTemplate>

</asp:Repeater>

Dans mon projet Repeater Control fonctionne très bien. Et maintenant, j'ai besoin de pagination pour remplacer ces données. Mais je n'ai aucune information à ce sujet. Peut-être que quelqu'un me donnera des conseils sur cette question.

Comme illustré ci-dessous.

enter image description here

c#jqueryasp.netpaginationrepeater
10
Jeyhun

Il n'y a pas de pagination intégrée dans le contrôle Repeater, mais en fonction de l'article this , vous pouvez obtenir la pagination dans le contrôle Repeater en créant un autre contrôle Repeater pour les pages et en utilisant PagedDataSource comme source .

Tout d'abord, ajoutez ceci à votre balisage:

<div style="overflow: hidden;">

<asp:Repeater ID="rptPaging" runat="server" OnItemCommand="rptPaging_ItemCommand">
 <ItemTemplate>
  <asp:LinkButton ID="btnPage"
   style="padding:8px;margin:2px;background:#ffa100;border:solid 1px #666;font:8pt tahoma;"
   CommandName="Page" CommandArgument="<%# Container.DataItem %>"
   runat="server" ForeColor="White" Font-Bold="True">
    <%# Container.DataItem %>
  </asp:LinkButton>
 </ItemTemplate>
</asp:Repeater>

</div>

Ensuite, ajoutez la propriété suivante dans votre code derrière:

//This property will contain the current page number 
public int PageNumber
{
    get
    {
        if (ViewState["PageNumber"] != null)
        {
            return Convert.ToInt32(ViewState["PageNumber"]);
        }
        else
        {
            return 0;
        }
    }
    set { ViewState["PageNumber"] = value; }
}

Enfin, ajoutez les méthodes suivantes:

protected void Page_Load(object sender, EventArgs e)
{
    BindRepeater();
}

private void BindRepeater()
{
    //Do your database connection stuff and get your data
    SqlConnection cn = new SqlConnection(yourConnectionString);
    SqlCommand cmd = new SqlCommand();
    cmd.Connection = cn;
    SqlDataAdapter ad = new SqlDataAdapter(cmd);
    cmd.CommandText = "Select * from YourTable";

    //save the result in data table
    DataTable dt = new DataTable();
    ad.SelectCommand = cmd;
    ad.Fill(dt);

    //Create the PagedDataSource that will be used in paging
    PagedDataSource pgitems = new PagedDataSource();
    pgitems.DataSource = dt.DefaultView;
    pgitems.AllowPaging = true;

    //Control page size from here 
    pgitems.PageSize = 4;
    pgitems.CurrentPageIndex = PageNumber;
    if (pgitems.PageCount > 1)
    {
        rptPaging.Visible = true;
        ArrayList pages = new ArrayList();
        for (int i = 0; i <= pgitems.PageCount - 1; i++)
        {
            pages.Add((i + 1).ToString());
        }
        rptPaging.DataSource = pages;
        rptPaging.DataBind();
    }
    else
    {
        rptPaging.Visible = false;
    }

    //Finally, set the datasource of the repeater
    RepCourse.DataSource = pgitems;
    RepCourse.DataBind();
}

//This method will fire when clicking on the page no link from the pager repeater
protected void rptPaging_ItemCommand(object source, System.Web.UI.WebControls.RepeaterCommandEventArgs e)
{
    PageNumber = Convert.ToInt32(e.CommandArgument) - 1;
    BindRepeater();
}

Veuillez l'essayer et si vous rencontrez un problème, informez-moi.

Modifier: Solution alternative

Une autre excellente solution peut être trouvée ici , cette solution comprend les boutons de navigation des pages . Vous devrez télécharger des fichiers à partir de ce lien pour voir une pagination fonctionnelle et remplacer simplement le contrôle DataList par votre contrôle Repeater.

J'espère que cela t'aides.

22
kal kokah