AJAX和三层架构实现分页功能具体思路及代码

复制代码 代码如下:

  -----------------------------HTMLPage1.htm---------------------------------

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head>

  <title></title>

  <style type="text/css">

  table{ border:solid 1px #444; background-color:Aqua;}

  table td{border:solid 1px #444;}

  </style>

  <script src="js/Jquery1.7.js" type="text/javascript"></script>

  <script type="text/javascript">

  $(function () {

  var pageindex = 1;

  var pagesize = 10;

  var lastpageindex = 1;

  loaddata();

  function loaddata() {

  $.ajax({

  type: "post",

  contentType: "application/json",

  url: "WebService1.asmx/GetListAjax",

  data: "{pagesize:" + pagesize + ",pageindex:" + pageindex + "}",

  success: function (result) {

  var strtable = '<table>';

  strtable += '<tr><td>编号</td><td>标题</td><td>内容</td><td>创建时间</td></tr>';

  for (var i = 0; i < result.d.length; i++) {

  strtable += '<tr>';

  strtable += '<td>' + result.d[i].Id + '</td>';

  strtable += '<td>' + result.d[i].NewsTitle + '</td>';

  strtable += '<td>' + result.d[i].NewsContent + '</td>';

  strtable += '<td>' + result.d[i].CreateTime + '</td>';

  strtable += '</tr>';

  }

  strtable += '</table>';

  $('#mydiv').html(strtable);

  }

  })

  }

  $.ajax({

  type: "post",

  contentType: "application/json",

  url: "WebService1.asmx/GetLastPageindex",

  data: "{pagesize:" + pagesize + "}",

  success: function (result) {

  lastpageindex = result.d;

  }

  })

  //第一页

  $('a:first').click(function () {

  pageindex = 1;

  loaddata();

  })

  //上一页

  $('#divfenye a:eq(1)').click(function () {

  if (pageindex > 1) {

  pageindex--;

  loaddata();

  }

  })

  //下一页

  $('#divfenye a:eq(2)').click(function () {

  if (pageindex < lastpageindex) {

  pageindex++;

  loaddata();

  }

  })

  //最后一页

  $('#divfenye a:eq(3)').click(function () {

  pageindex = lastpageindex;

  loaddata();

  })

  $('#divfenye a:last').click(function () {

  pageindex = $('#txtPageindex').val();

  loaddata();

  })

  $('#txtPageindex').focus(function () {

  $(this).val('');

  })

  })

  </script>

  </head>

  <body>

  <div id="mydiv">

  </div>

  <div id="divfenye"><a href="#">第一页</a><a href="#">上一页</a><a href="#">下一页</a><a href="#">最后一页</a><input

  id="txtPageindex" type="text" /><a href="#">Go</a></div>

  </body>

  </html>

  -------------------------WebService1 --------------------------------

  // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。

  [System.Web.Script.Services.ScriptService]

  public class WebService1 : System.Web.Services.WebService

  {

  [WebMethod]

  public string HelloWorld()

  {

  return "Hello World";

  }

  [WebMethod]

  public List<Model.T_News1> GetListAjax(int pagesize, int pageindex)

  {

  BLL.T_News1 bnews = new BLL.T_News1();

  DataTable dt = bnews.GetListDataTable(pagesize, pageindex);

  List<Model.T_News1> list = new List<Model.T_News1>();

  int Id;

  string newstitle = "";

  string newscontent = "";

  DateTime createtime;

  for (int i = 0; i < dt.Rows.Count; i++)

  {

  Id = Convert.ToInt32(dt.Rows[i]["Id"]);

  newstitle = dt.Rows[i]["NewsTitle"].ToString();

  newscontent = dt.Rows[i]["NewsContent"].ToString();

  createtime = Convert.ToDateTime(dt.Rows[i]["CreateTime"]);

  Model.T_News1 news = new Model.T_News1()

  {

  Id = Id,

  NewsTitle = newstitle,

  NewsContent = newscontent,

  CreateTime = createtime

  };

  list.Add(news);

  }

  return list;

  }

  [WebMethod]

  public int GetLastPageindex(int pagesize)

  {

  BLL.T_News1 bnews = new BLL.T_News1();

  int totalcount = bnews.GetRecordCount("");

  if (totalcount % pagesize == 0)

  {

  return totalcount / pagesize;

  }

  else

  {

  return totalcount / pagesize + 1;

  }

  }

  ------------------------------DAL层:--------------------------

  /// <summary>

  /// 分页获取数据列表

  /// </summary>

  public DataTable GetListDataTable(int PageSize, int PageIndex)

  {

  SqlParameter[] parameters = {

  new SqlParameter("@PageSize", SqlDbType.Int),

  new SqlParameter("@PageIndex", SqlDbType.Int)

  };

  parameters[0].Value = PageSize;

  parameters[1].Value = PageIndex;

  return DbHelperSQL.RunProcedureDataTable("pro_fenye", parameters);

  }

  --------------------BLL层:--------------------------

  public DataTable GetListDataTable(int pagesize, int pageindex)

  {

  return dal.GetListDataTable(pagesize, pageindex);

  }

  ------------------DbHelperSQL:-----------------------

  public static DataTable RunProcedureDataTable(string storedProcName, IDataParameter[] parameters)

  {

  using (SqlConnection connection = new SqlConnection(connectionString))

  {

  DataTable dt = new DataTable();

  connection.Open();

  SqlDataAdapter sqlDA = new SqlDataAdapter();

  sqlDA.SelectCommand = BuildQueryCommand(connection, storedProcName, parameters);

  sqlDA.Fill(dt);

  connection.Close();

  return dt;

  }

  }