AspNetPager 控件使用

使用方法：

1、添加对AspNetPager.dll的引用

2、在页面上拖放控件

3、

<%@ Register assembly="AspNetPager" namespace="Wuqi.Webdiyer" tagprefix="webdiyer" %>

4、控件的基本属性设置

<webdiyer:AspNetPager ID="AspNetPager1" runat="server"

FirstPageText='首页'

LastPageText='尾页' PagingButtonSpacing="10px" ShowPageIndexBox="Always" CustomInfoHTML="共%RecordCount%条，第%CurrentPageIndex%页 /共%PageCount% 页"

NextPageText="下一页" PrevPageText ="上一页"

ShowCustomInfoSection="Left"

SubmitButtonText ="Go" TextAfterPageIndexBox ="页"

TextBeforePageIndexBox ="转到 " UrlPaging="True"

CustomInfoSectionWidth="20%" CustomInfoTextAlign="Center"

onpagechanged="AspNetPager1_PageChanged">

</webdiyer:AspNetPager>

5、后台代码

protected void Page_Load(object sender, EventArgs e)

{

string sqlStr = "select * from download where 1=1 ";

if (key.Text != "")

{

sqlStr += "and title like '%" + key.Text + "%' order by id desc";

}

else

{

sqlStr += "order by id desc";

}

string s = ConfigurationManager.ConnectionStrings["siteconn"].ConnectionString; //定义连接字符串

SqlConnection conn = new SqlConnection(s); //新建数据库连接对象，其中s是上面的连接字符串

conn.Open(); //打开与数据库的连接

SqlCommand cmd = new SqlCommand(sqlStr, conn);

AspNetPager1.AlwaysShow = true;

AspNetPager1.PageSize = 15;

AspNetPager1.RecordCount = (int)cmd.ExecuteScalar();

conn.Close();

bind();

}

private void bind()

{

string sqlStr = "select * from download where 1=1 ";

if (key.Text != "")

{

sqlStr += "and title like '%" + key.Text + "%' order by id desc";

}

else

{

sqlStr += "order by id desc";

}

string s = ConfigurationManager.ConnectionStrings["siteconn"].ConnectionString; //定义连接字符串

SqlConnection conn = new SqlConnection(s); //新建数据库连接对象，其中s是上面的连接字符串

conn.Open(); //打开与数据库的连接

DataSet myds = new DataSet();

SqlDataAdapter adapter = new SqlDataAdapter(sqlStr, conn);

adapter.Fill(myds, AspNetPager1.PageSize * (AspNetPager1.CurrentPageIndex - 1), AspNetPager1.PageSize, "myds");

GridView1.DataSource = myds.Tables["myds"];

GridView1.DataBind();

}

protected void AspNetPager1_PageChanged(object sender, EventArgs e)

{

bind();

}

6、添加序号

<asp:TemplateField HeaderText="序号">

<%# (this.AspNetPager1.CurrentPageIndex - 1) * this.AspNetPager1.PageSize + Container.DataItemIndex + 1%>

</ItemTemplate>

</asp:TemplateField>

精美样式：

曾祥展

分页是Web应用程序中最常用到的功能之一，AspNetPager 简单实用，应用到项目后台中，棒极了！

自定义样式：

<style type="text/css">
/*拍拍网风格*/
.paginator { font: 11px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
.paginator a {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin-right:2px}
.paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
.paginator .cpb {padding: 1px 6px;font-weight: bold; font-size: 13px;border:none}
.paginator a:hover {color: #fff; background: #ffa501;border-color:#ffa501;text-decoration: none;}

/*淘宝风格*/
.paginator { font: 12px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
.paginator a {border:solid 1px #ccc;color:#0063dc;cursor:pointer;text-decoration:none;}
.paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
.paginator .cpb {border:1px solid #F50;font-weight:700;color:#F50;background-color:#ffeee5;}
.paginator a:hover {border:solid 1px #F50;color:#f60;text-decoration:none;}
.paginator a,.paginator a:visited,.paginator .cpb,.paginator a:hover  
{float:left;height:16px;line-height:16px;min-width:10px;_width:10px;margin-right:5px;text-align:center;
 white-space:nowrap;font-size:12px;font-family:Arial,SimSun;padding:0 3px;}
 </style>

前台：

<table cellpadding="0" cellspacing="0" align="center" width="99%" class="border">
<tr>
<td align="left" colspan="2">
<webdiyer:AspNetPager ID="AspNetPager1" CssClass="paginator"   CurrentPageButtonClass="cpb" runat="server" AlwaysShow="True" 
FirstPageText="首页"  LastPageText="尾页" NextPageText="下一页"  PageSize="20" PrevPageText="上一页"  ShowCustomInfoSection="Left" 
ShowInputBox="Never" onpagechanged="AspNetPager1_PageChanged"  CustomInfoTextAlign="Left" LayoutType="Table"  >
</webdiyer:AspNetPager>
</td>
</tr>
</table>

后台：

void bindData()
   {
       .......绑定语句
       this.AspNetPager1.CustomInfoHTML = string.Format("当前第{0}/{1}页 共{2}条记录 每页{3}条", new object[] { this.AspNetPager1.CurrentPageIndex, this.AspNetPager1.PageCount, this.AspNetPager1.RecordCount, this.AspNetPager1.PageSize });
   }
   protected void AspNetPager1_PageChanged(object src, EventArgs e)
   {
       bindData();
   }

效果三如下：

做的不是很好看，希望大家不要丢砖头，俺的头没包棉絮，伤不起 ~—_—~

CSS样式表：

/* AspNetPager Style Power By http://www.edweb.cn */
.pager{ 95%; margin:10px; line-height:20px; display:block;}
.pager span { border:1px solid #CCCCCC; margin: 0 5px; padding: 1px 6px; float:left;}
.pager a {
    border: 1px solid #CCCCCC;
    display: block;
    overflow:hidden;
    float: left;
    margin: 0 5px;
    padding: 1px 6px;
}
.pager a:hover { border:1 solid red; background-color:#993399; color:#ffffff; margin: 0 5px; padding: 1px 6px;}

调用方式：在分页控件的外面加一个div包裹起来，直接调用