牛腩购物小结之: anpnetpager分页控件的使用图

系统 1530 0

分页控件的使用

一:下载,并在 vs2010 里面添加  anpnetpager 控件

1:  下载   http://www.webdiyer.com/Controls/AspNetPager/Downloads 下载

image

2:   将 AspNetPager.dll 和 AspNetPager.xml 考入到项目的 bin 文件夹 并在Bin文件夹上引用AspNetPager。(这一步其实可以用不,执行下面的第三部,就会把第二步执行一次的,不过这个 xml 好像不会自动考进来,所以我们还是把第一步 执行比较好)

  image 拷贝到 web层的Bin文件夹,并引用。

 

3:在VS2010 工具栏上面,右键新建项,然后找到刚才 bin文件的 AspNetPager.dll ,这样在工具栏就可以使用 AspNetPager了,将控件拖到你需要分页的地方,就可以了。

image image

然后就可以在工具栏看到 AspNetPager 控件了

image

 

二: 下面开始如何分页的步骤

1:分页控件的准备,我们上面已经做好了

2:在sql2005以及以上,运行分页的存储过程

      
        -- =============================================
      
      
        -- 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,          
      
        -- 页尺寸,默认10
      
      

@PageIndex 
      
        int
      
       = 1,           
      
        -- 页码,默认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)
    

注意:如果用到多表查询,还是使用上面的这个存储过程,下面是在sqlserver 2005 中的查询分析器中调用 上面的存储过程来进行多表查询

      //这里是在存储过程里面的调用方法,可以使用多表查询的。


      
        EXEC
      
          [proc_ShowPage]   

        @tblName = N'
      
        (project p inner join projectca ca on p.caid=ca.id)
      
      ',   

        @strGetFields = N'
      
        p.title,ca.caname
      
      ',   

        @strOrder = N'
      
        p.id
      
      ',   

        @strOrderType = N'
      
        desc
      
      ',   

        @PageSize = 12,   

        @PageIndex = 1,   

        @strWhere = N'
      
      
      ' 
    

 

2:在页面上需要使用分页控件的地方,拉入控件,修改 上一页,下一页,尾页和首页的文字,设置为一直显示。

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

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

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

                    ShowCustomInfoSection="
      
        Left
      
      " CssClass="
      
        paginator
      
      " 

                    CurrentPageButtonClass="
      
        cpb
      
      " CustomInfoSectionWidth="
      
      
      "  >


    

然后设置它的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 ;}






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

 

3:在分页控件上,双击 进入后台编写分页控件点击的代码(先是统计anp分页控件的所有的产品数,然后是给产品rep绑定)

    Niunan.Shop.DAL.
    
      ProductDAO 
    
    pro = 
    
      new 
    
    DAL.
    
      ProductDAO
    
    ();

        
    
      protected void 
    
    Page_Load(
    
      object 
    
    sender, 
    
      EventArgs 
    
    e)

        {

            
    
      //页面进入的时候,分页控件先统计总的条数,然后绑定产品

            
    
    
      if 
    
    (!Page.IsPostBack)

            {

                anp.RecordCount = pro.ClacCount(getCond());

                BindRepPro();

            }

        }



        
    
      //绑定产品

        
    
    
      private void 
    
    BindRepPro()

        {

            
    
      //这里获取产品的时候,是调用分页来调用。分页的个数由 anp.PageSize 控制

            
    
    repNewPro.DataSource = pro.GetList(
    
      "*"
    
    , 
    
      "id"
    
    , 
    
      "desc"
    
    , anp.PageSize, anp.CurrentPageIndex, getCond());

            repNewPro.DataBind();

        }



        
    
      //获取条件

        
    
    
      private string 
    
    getCond()

        {

            
    
      string 
    
    cond = 
    
      "isxp=1"
    
    ;

            
    
      return 
    
    cond;

        }

        
    
      //分页控件点击事件(实际上就是重新绑定产品)

        
    
    
      protected void 
    
    anp_PageChanged(
    
      object 
    
    sender, 
    
      EventArgs 
    
    e)

        {

            BindRepPro();

        }


  

注释事项:

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

假如我们在 ajax控件里面有用到分页控件,那么如果是 postback提交分页 ,则ajax有效(也就是url不会有动静,但是页面有修改), 如果是 url 分页 ,那么页面的url会跟着改变了,就会变成 page=2 这样。

 

更加详细的设置,参见下面2篇分页文章 

1:牛腩新闻发布系统  http://www.cnblogs.com/1727050508/archive/2012/02/29/2373612.html

2:牛腩购物系统        http://www.cnblogs.com/1727050508/archive/2012/03/05/2379982.html

 

 

 

注意:1使用的分页函数是 只有3个参数的

image

2:使用的是 6个 参数的(实际存储过程需要7个参数,但是表名我们是手动在下面写了 shop_product)

    
      /// <summary>
    
    
      分页获取数据列表

        
    
    
      /// 

        /// </summary>

        /// <param name="strGetFields">
    
    
      选择的字段
    
    
      </param>

        /// <param name="strOrder">
    
    
      排序字段
    
    
      </param>

        /// <param name="strOrderType">
    
    
      排序类型 desc或者asc
    
    
      </param>

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

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

        /// <param name="strWhere">
    
    
      条件
    
    
      </param>

        /// <returns></returns>

        
    
    
      public 
    
    
      DataSet 
    
    GetList(
    
      string 
    
    strGetFields, 
    
      string 
    
    strOrder, 
    
      string 
    
    strOrderType, 
    
      int 
    
    PageSize, 
    
      int 
    
    PageIndex, 
    
      string 
    
    strWhere)

        {

            
    
      Database 
    
    db = 
    
      DatabaseFactory
    
    .CreateDatabase();

            
    
      DbCommand 
    
    dbCommand = db.GetStoredProcCommand(
    
      "proc_FenYe"
    
    );

            db.AddInParameter(dbCommand, 
    
      "tblName"
    
    , 
    
      DbType
    
    .AnsiString, 
    
      "shop_product"
    
    );

            db.AddInParameter(dbCommand, 
    
      "strGetFields"
    
    , 
    
      DbType
    
    .AnsiString, strGetFields);

            db.AddInParameter(dbCommand, 
    
      "PageSize"
    
    , 
    
      DbType
    
    .Int32, PageSize);

            db.AddInParameter(dbCommand, 
    
      "PageIndex"
    
    , 
    
      DbType
    
    .Int32, PageIndex);

            db.AddInParameter(dbCommand, 
    
      "strOrder "
    
    , 
    
      DbType
    
    .String, strOrder);

            db.AddInParameter(dbCommand, 
    
      "strOrderType"
    
    , 
    
      DbType
    
    .String, strOrderType);

            db.AddInParameter(dbCommand, 
    
      "strWhere"
    
    , 
    
      DbType
    
    .AnsiString, strWhere);

            
    
      return 
    
    db.ExecuteDataSet(dbCommand);

        }



        
    
      /// <summary>
    
    
      获取总的记录数

        
    
    
      /// 

        /// </summary>

        /// <param name="strWhere"></param>

        /// <returns></returns>

        
    
    
      public int 
    
    ClacCount(
    
      string 
    
    strWhere)

        {

            
    
      string 
    
    sql = 
    
      "select count(1) from shop_product"
    
    ;

            
    
      if 
    
    (!
    
      string
    
    .IsNullOrEmpty(strWhere))

            {

                sql += 
    
      " where " 
    
    + strWhere;

            }

            
    
      Database 
    
    db = 
    
      DatabaseFactory
    
    .CreateDatabase();

            
    
      DbCommand 
    
    dbCommand = db.GetSqlStringCommand(sql);

            
    
      return int
    
    .Parse(db.ExecuteScalar(dbCommand).ToString());



        }


  

3:在牛腩新闻发布系统的时候,使用过一次多表查询分页,但是是3个参数的,以后我们使用的时候,修改成多个参数即可

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

        }


  

牛腩购物小结之: anpnetpager分页控件的使用图文教程,anpnetpager分页多表查询


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论