[ASP.NET][WebControl] GridView自訂頁面切換功能

[ASP.NET][WebControl] GridView自訂頁面切換功能

GridView中當想讓使用者自行設定每個頁面呈現多少列資料或是

讓使用者切換到第幾個頁面的時候,GridView的自帶PagerSettings就不是

很符合各自的需求了,這時候可以使用PagerTemplate來去自定功能


        <PagerTemplate>
                <asp:DropDownList ID="ddlSelectPageSize" runat="server" AutoPostBack="True" onselectedindexchanged="ddlSelectIndexChanged">
                </asp:DropDownList>
                <asp:DropDownList ID="ddlSelectPage" runat="server" AutoPostBack="True" onselectedindexchanged="ddlSelectIndexChanged">
                </asp:DropDownList>

                <asp:LinkButton ID="cmdFirstPage" runat="server" CommandName="Page" Text="第一頁"
                    CommandArgument="First" Visible="<%# ((GridView)Container.Parent.Parent).PageIndex!=0 %>" >
                </asp:LinkButton>
                <asp:LinkButton ID="cmdPreview" runat="server" CommandArgument="Prev" Text="上一頁"
                    CommandName="Page" Visible="<%# ((GridView)Container.Parent.Parent).PageIndex!=0 %>">
                </asp:LinkButton>
                <asp:Label ID="lblRowCount" runat="server"></asp:Label>
                <asp:LinkButton ID="cmdNext" runat="server" CommandName="Page" Text="下一頁"
                    CommandArgument="Next" Visible="<%# ((GridView)Container.Parent.Parent).PageIndex!=((GridView)Container.Parent.Parent).PageCount-1 %>">
                </asp:LinkButton>
                <asp:LinkButton ID="cmdLastPage" runat="server" CommandArgument="Last" Text="最後一頁"
                    CommandName="Page" Visible="<%# ((GridView)Container.Parent.Parent).PageIndex!=((GridView)Container.Parent.Parent).PageCount-1 %>">
                </asp:LinkButton>                  
            </PagerTemplate>
        </asp:GridView>

 

然後在CodeBehind中,頁面切換還是使用GridView的PageIndexChanging事件

每次在更動後,都要使GridView重新Bind


    {
        if (!IsPostBack)
        {
            gvBind(GridView1);
            ddlBind(GridView1);
        }
    }

    protected void gvBind(GridView gv)
    {
        using (IDbConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString))
        {
            string str = "select EmployeeID,Title,LastName,FirstName from Employees";
            using (SqlDataAdapter da = new SqlDataAdapter(str, (SqlConnection)conn))
            {
                DataTable dt = new DataTable();
                da.Fill(dt);
                gv.DataSource = dt;                
                gv.DataBind();
            }
        }
    }
    

    protected void ddlBind(GridView gv)
    {
        if (gv.BottomPagerRow != null)
        {
            //讓下拉式選單顯示頁數
            DropDownList ddlSelectPage = (DropDownList)gv.BottomPagerRow.FindControl("ddlSelectPage");
            for (int i = 0; i < GridView1.PageCount; i++)
            {
                ddlSelectPage.Items.Add(new ListItem("第" + (i + 1).ToString() + "頁", i.ToString()));
            }
            //顯示目前頁數
            ddlSelectPage.SelectedIndex = gv.PageIndex;

            //下拉選單顯示頁面資料列數
            DropDownList ddlSelectPageSize = (DropDownList)gv.BottomPagerRow.FindControl("ddlSelectPageSize");
            if (ddlSelectPageSize.Items.Count <= 0)
            {
                ddlSelectPageSize.Items.Add(new ListItem("每頁1筆", "1"));
                ddlSelectPageSize.Items.Add(new ListItem("每頁2筆", "2"));
                ddlSelectPageSize.Items.Add(new ListItem("每頁3筆", "3"));
            }
            //顯示目前列數
            ddlSelectPageSize.SelectedValue = gv.PageSize.ToString();
        }
    }

    protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
    {
        ((GridView)(sender)).PageIndex = e.NewPageIndex;
        gvBind(((GridView)(sender)));
        ddlBind(((GridView)(sender)));
    }

    protected void ddlSelectIndexChanged(object sender, EventArgs e)
    {
        int ddlIndex = 0;
        if (int.TryParse(((DropDownList)(sender)).SelectedValue, out ddlIndex))
        {
            switch (((DropDownList)(sender)).ID)
            {
                case "ddlSelectPageSize":
                    GridView1.PageSize = ddlIndex;
                    break;
                case "ddlSelectPage":
                    GridView1.PageIndex = ddlIndex;
                    break;
            }
            gvBind(GridView1);
            ddlBind(GridView1);
        }
    }

 

畫面呈現

image

 

範例檔案 GridViewPage

 

Dotblogs 的標籤: ,,