当前位置: 移动技术网 > IT编程>开发语言>.net > ASP.NET无刷新分页简单实现

ASP.NET无刷新分页简单实现

2017年12月12日  | 移动技术网IT编程  | 我要评论

灵璧县教育局,花圈挽联,黄山一线天

下面就是和大家分享的实现无刷新分页功能的全部步骤,欢迎学习。

1、新建一个分页存储过程:

create procedure [dbo].[p_pager] 
(@pagenumber int, 
@pagesize int) 
as 
 declare @sql nvarchar(4000) 
  set @sql = 'select top ' + convert(varchar, @pagesize)  + ' * from t_test where [type]=1 and id not in (select top ' + convert(varchar, (@pagenumber - 1) * @pagesize) + ' id from t_test order by id desc) order by id desc' 
 exec sp_executesql @sql 
go 

2、设置ajax控件

想要实现无刷新,肯定会用到ajax,首先是要放入必不可少的:

<asp:scriptmanager id="scriptmanager1" runat="server"> 
</asp:scriptmanager>

接着把repeater控件嵌入到updatepanel里面去:

<asp:updatepanel id="updatepanel1" runat="server"> 
      <contenttemplate> 
          <ul> 
            <asp:repeater id="repeater1" runat="server"> 
              <itemtemplate> 
                <li> 
                  <p> 
                    <span><%#eval("username") %>:</span><%#eval("content").tostring())) %></p> 
                  <p> 
                    <em>发表时间: 
                      <%#eval("addtime") %> 
                    </em> 
                  </p> 
                </li> 
              </itemtemplate> 
            </asp:repeater> 
          </ul> 
          <p> 
              总记录:<asp:literal id="ltlcount" runat="server"></asp:literal></p> 
            <p> 
              <webdiyer:aspnetpager id="aspnetpager1" runat="server" alwaysshow="true" pageindexboxtype="dropdownlist" > 
              </webdiyer:aspnetpager> 
            </p> 
          </div> 
      </contenttemplate> 
    </asp:updatepanel> 

3、aspnetpager分页控件

可以看到以上的代码有个分页控件,我相信这个分页控件大家都不陌生了,我就不多介绍。必须有aspnetpager.dll,然后在项目中引用,在头部引入这一段代码:

<%@ register assembly="aspnetpager" namespace="wuqi.webdiyer" tagprefix="webdiyer" %>
这时候分页控件应该就可以使用了。最后在后台绑定一下数据,同时也要绑定aspnetpager控件,完整的后台代码如下:

using system; 
using system.collections.generic; 
using system.web; 
using system.web.ui; 
using system.web.ui.webcontrols; 
using system.data; 
using wuqi.webdiyer; 
using system.data.sqlclient; 
  
public partial class ajaxpager : system.web.ui.page 
{ 
  int currentpagenumber;//当前页号  
  int pagesize = 5;//每页显示记录条数 
  protected void page_load(object sender, eventargs e) 
  { 
    if (!ispostback) 
    { 
      currentpagenumber = 1; 
      viewstate["currentpagenumber"] = currentpagenumber; 
      binddata(); 
    } 
    aspnetpager1.pagechanged += new eventhandler(aspnetpager1_pagechanged); //定义控件分页事件 
  } 
  
  //获取记录总数 
  private int getcount() 
  { 
    string sql = "select count(*) from t_test"; 
    datatable dt = gettable(sql, commandtype.text, values); 
    if (dt.rows.count > 0) 
    { 
      return convert.toint32(dt.rows[0][0]); 
    } 
    else 
    { 
      return 0; 
    } 
  } 
    
  //绑定数据 
  private void binddata() 
  { 
    ltlcount.text = getcount().tostring(); 
    currentpagenumber = convert.toint32(viewstate["currentpagenumber"]); 
    sqlparameter[] values = { new sqlparameter("@pagenumber", currentpagenumber), new sqlparameter("@pagesize", pagesize) }; 
      
    datatable dt = gettable("p_pager", commandtype.storedprocedure, values); //调用存储过程 
    if (dt.rows.count > 0) 
    { 
      aspnetpager1.pagesize = pagesize; 
      aspnetpager1.recordcount = getcount(); 
      aspnetpager1.currentpageindex = currentpagenumber; 
      this.repeater1.datasource = dt.defaultview; 
      this.repeater1.databind(); 
    } 
  } 
  
  //分页事件  
  void aspnetpager1_pagechanged(object sender, eventargs e) 
  { 
    currentpagenumber = aspnetpager1.currentpageindex; 
    viewstate["currentpagenumber"] = currentpagenumber; 
    binddata(); 
  } 
    
   // 读取存储过程返回table 
  private datatable gettable(string sql, commandtype t, params sqlparameter[] values) 
  { 
    using (sqlconnection conn = new sqlconnection("data source=127.0.0.1;initial catalog=testdb;persist security info=true;user id=sa;password=123456")) 
    { 
      sqlcommand comm = new sqlcommand(sql, conn); 
      comm.commandtype = t; 
      if (values != null && values.length > 0) 
        comm.parameters.addrange(values); 
      sqldataadapter da = new sqldataadapter(comm); 
      dataset ds = new dataset(); 
      try 
      { 
        conn.open(); 
        da.fill(ds); 
        return ds.tables[0]; 
      } 
      catch (exception) 
      { 
        return null; 
      } 
      finally 
      { 
        conn.close(); 
        conn.dispose(); 
      } 
    } 
  } 
} 

至此,基本大功告成,虽然比较简单,但是涉及到存储过程,ajax,分页控件等知识点,还是蛮值得收藏和学习的,希望我的这篇文章是抛砖引玉,让大家提供更好的方法,才是我学习的动力。

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网