牛腩新闻发布系统 总结 1：aspnetpager 使用总结 ajax控件总结

要使用 aspnetpager 的过程

1：要下载引用 aspnetpager 控件

 

2：要有分页的存储过程，可以单表查询，也可以多表查询

-- =============================================
-- Author: 牛腩
-- Create date: 2009-07-22 12:41
-- Description: 分页，用到了ROW_NUMBER()
-- =============================================
ALTER PROCEDURE [dbo].[proc_FenYe]
@tblName   varchar(255),       -- 表名
@strGetFields varchar(1000) = '*', -- 需要返回的列，默认*
@strOrder varchar(255)='',      -- 排序的字段名，必填
@strOrderType varchar(10)='ASC', -- 排序的方式,默认ASC
@PageSize   int = 10,          -- 页尺寸,默认
@PageIndex int = 1,           -- 页码,默认
@strWhere varchar(1500) = '' -- 查询条件(注意: 不要加where)
AS

declare @strSQL   varchar(5000)

if @strWhere !=''
set @strWhere=' where '+@strWhere

set @strSQL=
'SELECT * FROM ('+
'SELECT ROW_NUMBER() OVER (ORDER BY '+@strOrder+''+@strOrderType+') AS pos,'+@strGetFields+''+
'FROM '+@tblName+''+@strWhere+
') AS sp WHERE pos BETWEEN '+str((@PageIndex-1)*@PageSize+1)+' AND '+str(@PageIndex*@PageSize)

exec (@strSQL)

3：在工具栏托 aspnetpager控件到需要分页的地方，然后在 代码里面需要设置

int

pagesize = anp.PageSize;    //这个其实是为 分页的存储过程的调用准备的

int pageindex = anp.CurrentPageIndex;          //同上

anp.RecordCount = nm.CalcCount(cond);          //这是设置 anp分页空间的总的记录数

repNews.DataSource = nm.Select(pagesize, pageindex, cond);     //这里就是分页控件的使用（取出1个页面的数据，仅仅是1个页面的，非所有的页面数据）

repNews.DataBind();

 

分页的函数如下

/// <summary>分页选择新闻

        /// 

        /// </summary>

        /// <param name="pageSize">页面大小</param>

        /// <param name="pageIndex">页索引</param>

        /// <param name="cond">条件(不用加where)</param>

        /// <returns></returns>

        public DataTable Select(int pageSize, int pageIndex, string cond)

        {

            //执行分页的存储过程  [proc_FenYe]

            DataTable dt = new DataTable();

            string procname = "proc_FenYe";

            SqlParameter[] paras = new SqlParameter[]{

            new SqlParameter("@tblName","(news a inner join  category b on a.caId=b.id and a.caId=b.id)" as object),

            new SqlParameter("@strGetFields","a.id,a.title,a.caid,a.createtime,a.content,b.name" as object),

            new SqlParameter("@strOrder","a.createtime" as object),   //通过time来排序

            new SqlParameter("@strOrderType","desc" as object),

            new SqlParameter("@PageSize ",pageSize as object),

            new SqlParameter("@PageIndex",pageIndex as object),

            new SqlParameter("@strWhere",cond as object)

            };

            dt = new SQLHelper().ExecuteQuery(procname, paras, CommandType.StoredProcedure);

            return dt;

        }

 

4：设置分页的样式，可以使用拍拍网的样式

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

 

然后给 anp控件加上  属性设置： CssClass="paginator" CurrentPageButtonClass="cpb"

5：设置是否为 Url 分页或者是默认的 postback提交，或者是其他的。

<webdiyer:AspNetPager ID="anp" runat="server" AlwaysShow="True" 

                    FirstPageText="首页" LastPageText="尾页" NextPageText="下一页" PrevPageText="上一页" 

                    CustomInfoHTML="总计%RecordCount%条记录，共%PageCount%页，每页%PageSize%条" 

                    ShowCustomInfoSection="Left" CssClass="paginator" 

                    CurrentPageButtonClass="cpb" CustomInfoSectionWidth="" 

                    onpagechanged="anp_PageChanged"   >

 

6：切记要双击一下 anp 控件，生成一个  函数，表示当我们点击分页之后，我们要做什么？（实际上就是绑定数据，同第3步骤）

 protected void anp_PageChanged(object sender, EventArgs e)

    {

        BindNews();

    }

大概就这么多就可以了

 

 

但是有以下小的注意事项：

1：我们在写一般的存储过程的时候，要记得，用 inner join   这个是个好习惯，因为我们一般的存储过程，要转换为 分页的查询的时候，有这个 inner join 就很明显的知道是查询哪几张表

 

 

要使用  ajax 控件的过程

1：假如，我们的数据是在一个表格的 GridView 或者是 repeater 里面的话，我们就可以把这个表格 或者是 div 的两头加上 UpdatePanel 控件。

并且在 UpdatePanel 的前面，加上一个  ScriptManager 控件就可以了

 

2：假如我们在 ajax控件里面有用到分页控件，那么如果是 postback提交分页，则ajax有效，如果是 url 分页，那么分页就会变成 page=2 这样。

 

3：如果是我们自己手写 ajax ，而不是用 系统自带的 ajax控件的话，那么一般是传值给一个  ashx 一般处理程序

用jquery 这个js控件，可以很好的帮助我们简化操作。

在用jquery 的时候，如果是get方式，那么要注意 数据的缓存（用url后面加多一个随机的时间来解决）和二次转码，并且 ashx 端接收数据还要进行一次解码

 

下面是JS端，分别是 get方式和 post 方式

 

//使用 jquery 的ajax 的get方法  需要对字符进行二次转码，并且要考虑 IE缓存的问题  ，并且在服务器的 ashx 页面 要进行解码

               // var url="../handler/ChangeCaName.ashx?caname="+ encodeURI(encodeURI(newText)) +"&caid="+caid+"&t="+new Date().getTime();            

               // $.get(url)

               

               $.post("../handler/ChangeCaName.ashx", { caname: newText, caid: caid },function(data){

                    if(data=="类别已经存在，修改失败")

                    {

                        alert(data);

                        objSPAN.html(oldcaname);

                    }

                    else

                    {

                        objSPAN.html(newText);

                    }

下面是  ashx 一般处理程序接收端

 // string caname = context.Server.UrlDecode(context.Request.QueryString["caname"]);  ////获取用 juqry的get方式传来的字符串，需要解码



        string caname = context.Request.Form["caname"];



        bool b = new CategoryManager().IsExists(caname);

        if (!b)

        {

            //开始修改类别

            string id = context.Request.Form["caid"];



            Category ca = new Category(id, caname);



            new CategoryManager().Update(ca);



            context.Response.Write("类别修改成功");



        }

        else

        {

            context.Response.Write("类别已经存在，修改失败");

        }