Jquery+Ajax+Json+ストレージ・プロシージャによる効率的なページング
12835 ワード
以前はページングをしていたとき、多くの友达がJqueryページングプラグインを使っていました.前に私が使っていたjqueryです.paper、必要な友达がいたら連絡してください.次はJquery+Ajax+Json+ストレージプロセスで効率的なページ分けを実現することを共有します.
この機能を実現するには、ページングストレージ、pagination、jsスタイル、くだらない話は多くありません.具体的には、次のコードを参照してください.
ページング・ストレージ・プロシージャ:PAGINATION
改ページスタイル:
まず一般的なハンドラを作成する、データベース内の内容を読み出して戻り値を得る.ファイルを作成するashx. ここではストレージ・プロシージャを使用しています.ストレージ・プロシージャはさらに下に貼り付けられます.データはインスタンスにすぎません.必要に応じて自分でデータを読み取ることができます.
スタイルコード:
jsコード
///Execute a SqlCommand that returns a resultset against the database specified in the connection string
///using the provided parameters.
///
//有効なデータベース接続文字列
////SqlCommandコマンドタイプ(ストアド・プロシージャ、T-SQL文など)
//ストアド・プロシージャの名前またはT-SQL文
////SqlCommandコマンドで使用されるパラメータのリストを配列形式で提供
///A SqlDataReader containing the results
public static SqlDataReader ExecuteReader( CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
{
SqlCommand cmd = new SqlCommand();
SqlConnection conn = new SqlConnection(connectionString);
//we use a try/catch here because if the method throws an exception we want to
//close the connection throw code, because no datareader will exist, hence the
//commandBehaviour.CloseConnection will not work
try
{
PrepareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
SqlDataReader rdr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
cmd.Parameters.Clear();
return rdr;
}
catch (Exception ex)
{
conn.Close();
throw new Exception(ex.Message);
}
}
以上、Jquery+Ajax+Json+ストレージ・プロシージャを使用して効率的なページングを実現したすべての内容です.
この機能を実現するには、ページングストレージ、pagination、jsスタイル、くだらない話は多くありません.具体的には、次のコードを参照してください.
ページング・ストレージ・プロシージャ:PAGINATION
CREATE PROCEDURE [dbo].[PAGINATION]
@FEILDS VARCHAR(),--
@PAGE_INDEX INT,--
@PAGE_SIZE INT,--
@ORDERTYPE BIT,-- desc asc
@ANDWHERE VARCHAR()='',--where where
@ORDERFEILD VARCHAR(), --
@TABLENAME VARCHAR() --
as
DECLARE @EXECSQL VARCHAR()
DECLARE @ORDERSTR VARCHAR()
DECLARE @ORDERBY VARCHAR()
BEGIN
set NOCOUNT on
IF @ORDERTYPE =
BEGIN
SET @ORDERSTR = ' > ( SELECT MAX(['+@ORDERFEILD+'])'
SET @ORDERBY = 'ORDER BY '+@ORDERFEILD+' ASC'
END
ELSE
BEGIN
SET @ORDERSTR = ' < ( SELECT MIN(['+@ORDERFEILD+'])'
SET @ORDERBY = 'ORDER BY '+@ORDERFEILD+' DESC'
END
IF @PAGE_INDEX = -- ,
BEGIN
IF @ANDWHERE=''
SET @EXECSQL = 'SELECT TOP '+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM '+@TABLENAME+' '+@ORDERBY
ELSE
SET @EXECSQL = 'SELECT TOP '+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM '+@TABLENAME+' WHERE '+@ANDWHERE+' '+ @ORDERBY
END
ELSE
BEGIN
IF @ANDWHERE=''
BEGIN --
SET @EXECSQL = 'SELECT TOP'+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM '+@TABLENAME+' WHERE '+@ORDERFEILD+
@ORDERSTR+' FROM (SELECT TOP '+STR(@PAGE_SIZE*(@PAGE_INDEX-))+' '+@ORDERFEILD+
' FROM '+@TABLENAME+' '+@ORDERBY+') AS TEMP) '+ @ORDERBY
END
ELSE
BEGIN
SET @EXECSQL = 'SELECT TOP'+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM '+@TABLENAME+' WHERE '+@ORDERFEILD+
@ORDERSTR+' FROM (SELECT TOP '+ STR(@PAGE_SIZE*(@PAGE_INDEX-))+' '+@ORDERFEILD+
' FROM '+@TABLENAME+' WHERE '+@ANDWHERE+' '+@ORDERBY+') AS TEMP) AND '+@ANDWHERE+' '+ @ORDERBY
END
END
EXEC (@EXECSQL)--
END
改ページスタイル:
まず一般的なハンドラを作成する、データベース内の内容を読み出して戻り値を得る.ファイルを作成するashx. ここではストレージ・プロシージャを使用しています.ストレージ・プロシージャはさらに下に貼り付けられます.データはインスタンスにすぎません.必要に応じて自分でデータを読み取ることができます.
using System;
using System.Web;
using System.Data.SqlClient;
using System.Data;
using System.Collections.Generic;
using System.Web.Script.Serialization;
using Model;
context.Response.ContentType = "text/plain";
var pageIndex = context.Request["PageIndex"];
// , 。
if (string.IsNullOrEmpty(pageIndex))
{
// sql
int count = ;
int.TryParse(new BLL.t_profit().SelectAllNum(), out count);
context.Response.Write(count);
context.Response.End();
}
//
else
{
int currentPageIndex = ;
int.TryParse(pageIndex, out currentPageIndex);
SqlParameter[] parms = new SqlParameter[] {
new SqlParameter("@FEILDS",SqlDbType.NVarChar,),
new SqlParameter("@PAGE_INDEX",SqlDbType.Int,),
new SqlParameter("@PAGE_SIZE",SqlDbType.Int,),
new SqlParameter("@ORDERTYPE",SqlDbType.Int,),
new SqlParameter("@ANDWHERE",SqlDbType.VarChar,),
new SqlParameter("@ORDERFEILD",SqlDbType.VarChar,)
};
parms[].Value = "id,name,sex,tel";//
parms[].Value = pageIndex;//
parms[].Value = ;//
parms[].Value = ;//
parms[].Value = "";//
parms[].Value = "id";//
List list = new List();
using (SqlDataReader sdr = Yoodor.DAL.SqlHelper.ExecuteReader(CommandType.StoredProcedure, "PAGINATION", parms))
{
while (sdr.Read())
{
list.Add(new Book { id = sdr[].ToString(), name = sdr[].ToString(), sex = sdr[].ToString(), tel = sdr[].ToString() });
}
}
context.Response.Write(new JavaScriptSerializer().Serialize(list).ToString());// Json
}
public string id { get; set; }
public string name { get; set; }
public string sex { get; set; }
public string tel { get; set; }
スタイルコード:
jsコード
$(function () {
$.post("GetData.ashx", null, function (data) {
var total = data;
PageClick(, total, );
});
PageClick = function (pageIndex, total, spanInterval) {
$.ajax({
url: "GetData.ashx",
data: { "PageIndex": pageIndex },
type: "post",
dataType: "json",
success: function (data) {
//
// int
var intPageIndex = parseInt(pageIndex);
//
var table = $("#content");
//
$("#content tr").remove();
//
for (var i = ; i < data.length; i++) {
table.append(
$("<tr><td>" +
data[i].id
+ "</td><td>" +
data[i].name
+ "</td><td>" +
data[i].sex
+ "</td><td>" +
data[i].tel
+ "</td></tr>")
);
} //for
//
//
var pageS = total
if (pageS % == ) pageS = pageS / ;
else pageS = parseInt(total / ) + ;
var $pager = $("#pager");
// div
$("#pager span").remove();
$("#pager a").remove();
//
if (intPageIndex == ) {
// $pager.append("<span class='disabled'> </span>");
}
else {
// var first = $("<a href='javascript:void()' first='" + + "'> </a>").click(function () {
// PageClick($(this).attr('first'), total, spanInterval);
// return false;
// });
// $pager.append(first);
}
//
if (intPageIndex == )
$pager.append("<span class='disabled'> </span>");
else {
var pre = $("<a href='javascript:void()' pre='" + (intPageIndex - ) + "'> </a>").click(function () {
PageClick($(this).attr('pre'), total, spanInterval);
return false;
});
$pager.append(pre);
}
//
var interval = parseInt(spanInterval); //
var start = Math.max(, intPageIndex - interval); //
var end = Math.min(intPageIndex + interval, pageS)//
if (intPageIndex < interval + ) {
end = ( * interval + ) > pageS ? pageS : ( * interval + );
}
if ((intPageIndex + interval) > pageS) {
start = (pageS - * interval) < ? : (pageS - * interval);
}
//
for (var j = start; j < end + ; j++) {
if (j == intPageIndex) {
var spanSelectd = $("<span class='current'>" + j + "</span>");
$pager.append(spanSelectd);
} //if
else {
var a = $("<a href='javascript:void()'>" + j + "</a>").click(function () {
PageClick($(this).text(), total, spanInterval);
return false;
});
$pager.append(a);
} //else
} //for
//
if (intPageIndex == Math.ceil(total / )) {
$pager.append("<span class='disabled'> </span>");
}
else {
var next = $("<a href='javascript:void()' next='" + (intPageIndex + ) + "'> </a>").click(function () {
PageClick($(this).attr("next"), total, spanInterval);
return false;
});
$pager.append(next);
}
//
if (intPageIndex == pageS) {
// $pager.append("<span class='disabled'> </span>");
}
else {
// var last = $("<a href='javascript:void()' last='" + pageS + "'> </a>").click(function () {
// PageClick($(this).attr("last"), total, spanInterval);
// return false;
// });
// $pager.append(last);
}
} //sucess
}); //ajax
}; //function
}); //ready
//////Execute a SqlCommand that returns a resultset against the database specified in the connection string
///using the provided parameters.
///
//有効なデータベース接続文字列
////SqlCommandコマンドタイプ(ストアド・プロシージャ、T-SQL文など)
//ストアド・プロシージャの名前またはT-SQL文
////SqlCommandコマンドで使用されるパラメータのリストを配列形式で提供
///A SqlDataReader containing the results
public static SqlDataReader ExecuteReader( CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
{
SqlCommand cmd = new SqlCommand();
SqlConnection conn = new SqlConnection(connectionString);
//we use a try/catch here because if the method throws an exception we want to
//close the connection throw code, because no datareader will exist, hence the
//commandBehaviour.CloseConnection will not work
try
{
PrepareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
SqlDataReader rdr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
cmd.Parameters.Clear();
return rdr;
}
catch (Exception ex)
{
conn.Close();
throw new Exception(ex.Message);
}
}
以上、Jquery+Ajax+Json+ストレージ・プロシージャを使用して効率的なページングを実現したすべての内容です.