牛腩新闻发布系统 总结 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("类别已经存在,修改失败");

        }

你可能感兴趣的:(PAGER)