Heim >Web-Frontend >js-Tutorial >Das JQuery-Paging-Plug-In jquery.pagination.js implementiert das aktualisierungsfreie paging_jquery

Das JQuery-Paging-Plug-In jquery.pagination.js implementiert das aktualisierungsfreie paging_jquery

WBOY
WBOYOriginal
2016-05-16 15:07:021321Durchsuche

Das Beispiel in diesem Artikel teilt Ihnen den relevanten Code des JQuery-Paging-Plug-Ins mit, um aktualisierungsfreies Paging zu Ihrer Referenz zu implementieren. Der spezifische Inhalt ist wie folgt:

1. Verwenden Sie das Plug-in jquery.pagination.js. Wenn Sie diese js-Datei nicht haben, kann ich sie Ihnen senden.

Zitat zuerst jquery.pagination.js (Paginierungs-JS), gefolgt von pagination.css (Paginierungsstil-CSS).

Klicken Sie, um diese beiden Dateien anzuzeigen

2. Der Seiten-JS-Code ist

<script type="text/javascript"> 

   var pageIndex = 0;  //页面索引初始值 
   var pageSize = 15;  //每页显示条数初始化,修改显示条数,修改这里即可 
   $(function () {
    InitTable(0); //Load事件,初始化表格数据,页面索引为0(第一页)
    //分页,PageCount是总条目数,这是必选参数,其它参数都是可选
    $("#Pagination").pagination(<%=pcount%>, {
     callback: PageCallback, //PageCallback() 为翻页调用次函数。
      prev_text: "&laquo; 上一页",
     next_text: "下一页 &raquo;",
     items_per_page:pageSize,
     num_edge_entries: 2,  //两侧首尾分页条目数
      num_display_entries: 6, //连续分页主体部分分页条目数
      current_page: pageIndex, //当前页索引
    });
    //翻页调用 
    function PageCallback(index, jq) {    
     InitTable(index); 
    } 
    //请求数据 
    function InitTable(pageIndex) {         
     $.ajax({ 
      type: "POST", 
      dataType: "text", 
      url: 'http://www.cnblogs.com/tool/Reserver/ManageBuyBatchManage.ashx',  //提交到一般处理程序请求数据 
      data: "pageIndex=" + (pageIndex) + "&pageSize=" + pageSize,   //提交两个参数:pageIndex(页面索引),pageSize(显示条数)     
      success: function(data) {
       $("#Result tr:gt(0)").remove();  //移除Id为Result的表格里的行,从第二行开始(这里根据页面布局不同页变) 
       $("#Result").append(data);    //将返回的数据追加到表格 
      } 
     }); 
    }
   }); 
</script>

3. Der Code in der Seite6c04bd5ca3fcae76e30b72ad730ca86d

 <table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
    <td width="60" align="right">商品名:</td>
    <td width="200" align="left"><input type="text" id="txtKeywords" class="keyword" /></td>
    <td width="200" align="left"><input id="search" type="button" value=" 查 找 " class="submit" /></td>
    <td > </td>
   </tr>
  </table>
  <table id="Result" cellspacing="0" cellpadding="0">   
    <tr> 
     <th>商品编号</th>
     <th>商品名称</th>
    </tr>                        
  </table> 
  <div id="Pagination" class="right flickr"></div>
4. Der Seitenhintergrundcode ist


  protected int pcount = 0;   //总条数
  protected void Page_Load(object sender, EventArgs e)
  {
   if (!IsPostBack)
   {
    BLL.TbGoods bll = new BLL.TbGoods();
    pcount = bll.GetRecordCount("Status='" + (int)Enum.RecordStatus.Normal + "'"); //获取页面总条数,即要现实的数据总条数,还不明白的话,就是select count(*)from Table ,就是这里的个数。
   }
  }
5. Der allgemeine Handler fffff.ashx-Code ist

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;
using System.Data;

namespace EShop.Web.Admin.tool.Reserver
{
 /// <summary>
 /// ListBuyBatchManage 的摘要说明
 /// </summary>
 public class ListBuyBatchManage : IHttpHandler
 {
  public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/plain";
   String str = string.Empty;
   
   if (context.Request["pageIndex"] != null && context.Request["pageIndex"].ToString().Length > 0)
   {
    int pageIndex; //具体的页面数
    int.TryParse(context.Request["pageIndex"], out pageIndex);
    if(context.Request["pageSize"]!=null&&context.Request["pageSize"].ToString().Length > 0)
    {
    //页面显示条数 
    int size = Convert.ToInt32(context.Request["pageSize"]);
    string data= BindSource(size,pageIndex);    
    context.Response.Write(data);
    context.Response.End();
    }
   }

   
  }  
  #region 无刷新分页
  public string BindSource(int pagesize,int page)
  { 
   BLL.TbGoods bll=new BLL.TbGoods();
   DataSet ds = bll.GetListByPage("Status='" + (int)Enum.RecordStatus.Normal + "'", "", pagesize * page + 1, pagesize * (page + 1)); //获取数据源的ds会吧。
   StringBuilder sb = new StringBuilder();
   if (ds!=null)
   {
    foreach (DataRow row in ds.Tables[0].Rows)
    {
     sb.Append("<tr><td>");
     sb.Append(row["GoodsUid"]);
     sb.Append("</td><td>");
     sb.Append(row["GoodsName"]);
     sb.Append("</td></tr>");
    }
   }
   return sb.ToString();
  }
  #endregion


  public bool IsReusable
  {
   get
   {
    return false;
   }
  }
 }
}

6. Rendern

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn