web-dev-qa-db-ja.com

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>

私のプロジェクトでRepeater Control 正常に動作します。そして今、それらのデータを置き換えるためのページネーションが必要です。しかし、私はこれに関する情報を持っていません。誰かがこの問題についてアドバイスをくれます。

下図のように。

enter image description here

c#jqueryasp.netpaginationrepeater
10
Jeyhun

Repeaterコントロールには組み込みのページネーションはありませんが、 this の記事に基づいて、ページに別のRepeaterコントロールを作成し、そのソースとしてPagedDataSourceを使用することでRepeaterコントロールのページネーションを実現できます。 。

まず、これをマークアップに追加します。

<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>

次に、コードビハインドに次のプロパティを追加します。

//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; }
}

最後に、次のメソッドを追加します。

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();
}

試してみてください。何か問題が発生した場合はお知らせください。

編集：代替ソリューション

別の優れたソリューションを見つけることができます ここ 、このソリューションにはページのナビゲーションボタンが含まれます。機能的なページネーションを確認するには、そのリンクからファイルをダウンロードし、DataListコントロールをRepeaterコントロールに置き換える必要があります。

お役に立てれば。

22
kal kokah