Heim Web-Frontend js-Tutorial jQuery getJSON()+.ashx 实现分页(改进版)_jquery

jQuery getJSON()+.ashx 实现分页(改进版)_jquery

May 16, 2016 pm 05:38 PM
分页

参考了:http://www.jb51.net/article/35110.htm
改进的地方:
1、ashx返回json数据,减少传输数据量,html页面样式控制也比较灵活;
2、改写html页的jQuery代码;
3、把3个ashx文件简化为1个。
一、创建表的测试数据

复制代码 代码如下:

create table test(id int identity,title varchar(36))
declare @index int;
set @index = 1;
while(@index begin
insert test(title) values (newid())
set @index = @index + 1
end

二、.html页
复制代码 代码如下:



















三、.ashx页
复制代码 代码如下:

public class Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
StringBuilder tb = new StringBuilder();
DataBase db = new DataBase();
int pageSize = 10;
int pageIndex = 0;
string type = context.Request.Params["type"];
switch (type)
{
case "first":
DataTable dt1 = db.GetDataSet("select top 10 * from test", null).Tables[0];
tb.Append(Common.DataTableToJSON(dt1, true)); //DataTable转为JSON
break;
case "next":
pageIndex = Convert.ToInt32(context.Request.Params["index"]);
DataTable dt2 = db.GetDataSet("select top " + pageSize.ToString() + " * from test where id> (select max(id) from (select top " + (pageSize * pageIndex).ToString() + " id from test) t)", null).Tables[0];
tb.Append(Common.DataTableToJSON(dt2, true));
break;
case "pre":
pageIndex = Convert.ToInt32(context.Request.Params["index"]);
DataTable dt3 = db.GetDataSet("select top " + pageSize.ToString() + " * from test where id> (select max(id) from (select top " + (pageSize * pageIndex).ToString() + " id from test) t)", null).Tables[0];
tb.Append(JSONHelper.DataTableToJSON(dt));
break;
}
context.Response.Write(tb.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
}

四、效果
jQuery getJSON()+.ashx 实现分页(改进版)_jquery 
--------------------------------------------------------------------------------------------------------------------
备注 (2010-7-10):
用sql2005 row_number()分页方法,.ashx页面代码可简化为
复制代码 代码如下:

public class Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
DataBase db = new DataBase();
int pageSize = 10;
int pageIndex = 0;
int.TryParse(context.Request.Params["index"], out pageIndex);
string type = context.Request.Params["type"];
string sql = string.Format("select * from ( select row_number() over (order by id) as rowNum,* from test) as t "
+ " where rowNum>{0} and rowNumDataTable dt = db.GetDataSet(sql, null).Tables[0];
context.Response.Write(JSONHelper.DataTableToJSON(dt));
}
public bool IsReusable
{
get
{
return false;
}
}
}

备注
其中JSONHelper.DataTableToJSON(dt)方法为DataTable解析成JSON,见另一篇文章JSONHelper帮助类
Erklärung dieser Website
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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Repo: Wie man Teamkollegen wiederbelebt
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie erstelle ich eine benutzerdefinierte Paginierung in CakePHP? Wie erstelle ich eine benutzerdefinierte Paginierung in CakePHP? Jun 04, 2023 am 08:32 AM

CakePHP ist ein leistungsstarkes PHP-Framework, das Entwicklern viele nützliche Tools und Funktionen bietet. Eine davon ist die Paginierung, die uns hilft, große Datenmengen auf mehrere Seiten aufzuteilen und so das Durchsuchen und Bearbeiten zu erleichtern. Standardmäßig stellt CakePHP einige grundlegende Paginierungsmethoden bereit, aber manchmal müssen Sie möglicherweise einige benutzerdefinierte Paginierungsmethoden erstellen. In diesem Artikel erfahren Sie, wie Sie in CakePHP eine benutzerdefinierte Paginierung erstellen. Schritt 1: Erstellen Sie eine benutzerdefinierte Paginierungsklasse. Zuerst müssen wir eine benutzerdefinierte Paginierungsklasse erstellen. Das

PHP-Entwicklung: So implementieren Sie Funktionen zum Sortieren und Paging von Tabellendaten PHP-Entwicklung: So implementieren Sie Funktionen zum Sortieren und Paging von Tabellendaten Sep 20, 2023 am 11:28 AM

PHP-Entwicklung: So implementieren Sie Sortier- und Paging-Funktionen für Tabellendaten. In der Webentwicklung ist die Verarbeitung großer Datenmengen eine häufige Aufgabe. Bei Tabellen, die große Datenmengen anzeigen müssen, ist es normalerweise erforderlich, Datensortierungs- und Paging-Funktionen zu implementieren, um eine gute Benutzererfahrung zu bieten und die Systemleistung zu optimieren. In diesem Artikel wird die Verwendung von PHP zum Implementieren der Sortier- und Paging-Funktionen von Tabellendaten vorgestellt und spezifische Codebeispiele gegeben. Die Sortierfunktion implementiert die Sortierfunktion in der Tabelle und ermöglicht Benutzern die Sortierung in aufsteigender oder absteigender Reihenfolge nach verschiedenen Feldern. Das Folgende ist ein Implementierungsformular

Wie verwende ich JavaScript, um die Tabellen-Paging-Funktion zu implementieren? Wie verwende ich JavaScript, um die Tabellen-Paging-Funktion zu implementieren? Oct 20, 2023 pm 06:19 PM

Wie verwende ich JavaScript, um die Tabellen-Paging-Funktion zu implementieren? Mit der Entwicklung des Internets verwenden immer mehr Websites Tabellen zur Darstellung von Daten. In einigen Fällen, in denen die Datenmenge groß ist, müssen die Daten auf Seiten angezeigt werden, um die Benutzererfahrung zu verbessern. In diesem Artikel wird erläutert, wie Sie JavaScript zum Implementieren der Tabellen-Paging-Funktion verwenden, und es werden spezifische Codebeispiele bereitgestellt. 1. HTML-Struktur Zuerst müssen wir eine HTML-Struktur vorbereiten, um Tabellen und Paging-Schaltflächen zu hosten. Wir können <tab verwenden

Ausführliche Erläuterung des Prinzips des MyBatis-Paging-Plug-Ins Ausführliche Erläuterung des Prinzips des MyBatis-Paging-Plug-Ins Feb 22, 2024 pm 03:42 PM

MyBatis ist ein hervorragendes Persistenzschicht-Framework, das Datenbankoperationen basierend auf XML und Anmerkungen unterstützt. Es ist einfach und benutzerfreundlich und bietet außerdem einen umfangreichen Plug-In-Mechanismus. Unter diesen ist das Paging-Plugin eines der am häufigsten verwendeten Plug-Ins. Dieser Artikel befasst sich mit den Prinzipien des MyBatis-Paging-Plug-Ins und veranschaulicht es anhand konkreter Codebeispiele. 1. Paging-Plug-In-Prinzip MyBatis selbst bietet keine native Paging-Funktion, Sie können jedoch Plug-Ins verwenden, um Paging-Abfragen zu implementieren. Das Prinzip des Paging-Plug-Ins besteht hauptsächlich darin, MyBatis abzufangen

Verwendung von JavaScript zur Implementierung der Paging-Anzeige von Tabellendaten Verwendung von JavaScript zur Implementierung der Paging-Anzeige von Tabellendaten Jun 16, 2023 am 10:00 AM

Da die Datenmenge weiter wächst, wird die tabellarische Darstellung immer schwieriger. Meistens ist die Datenmenge in einer Tabelle so groß, dass das Laden langsamer wird und Benutzer die Seite ständig durchsuchen müssen, um die gewünschten Daten zu finden. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript eine paginierte Anzeige von Tabellendaten realisieren und Benutzern das Auffinden der gewünschten Daten erleichtern. 1. Tabellen dynamisch erstellen Um die Paging-Funktion besser kontrollierbar zu machen, müssen Tabellen dynamisch erstellt werden. Fügen Sie auf der HTML-Seite ein Tabellenelement hinzu, das dem folgenden ähnelt.

Vue-Komponentenpraxis: Entwicklung von Paging-Komponenten Vue-Komponentenpraxis: Entwicklung von Paging-Komponenten Nov 24, 2023 am 08:56 AM

Vue-Komponentenpraxis: Einführung in die Entwicklung von Paging-Komponenten In Webanwendungen ist die Paging-Funktion eine wesentliche Komponente. Eine gute Paginierungskomponente sollte einfach und klar in der Darstellung sein, reich an Funktionen und leicht zu integrieren und zu verwenden sein. In diesem Artikel stellen wir vor, wie Sie mit dem Vue.js-Framework eine hochgradig anpassbare Paging-Komponente entwickeln. Wir erklären anhand von Codebeispielen ausführlich, wie man mit Vue-Komponenten entwickelt. Technologie-Stack Vue.js2.xJavaScript (ES6) HTML5- und CSS3-Entwicklungsumgebung

So implementieren Sie die Paging-Funktion in der Vue-Technologieentwicklung So implementieren Sie die Paging-Funktion in der Vue-Technologieentwicklung Oct 09, 2023 am 09:06 AM

Vue ist ein beliebtes JavaScript-Framework zum Erstellen von Benutzeroberflächen. Bei der Entwicklung der Vue-Technologie ist die Implementierung der Paging-Funktion eine häufige Anforderung. In diesem Artikel wird erläutert, wie Sie Vue zum Implementieren der Paging-Funktion verwenden, und es werden spezifische Codebeispiele bereitgestellt. Bevor wir beginnen, müssen wir vorab einige Grundkenntnisse vorbereiten. Zunächst müssen wir die Grundkonzepte und die Syntax von Vue verstehen. Zweitens müssen wir wissen, wie wir Vue-Komponenten zum Erstellen unserer Anwendung verwenden. Bevor wir beginnen, müssen wir ein Paging-Plugin im Vue-Projekt installieren.

Der beste Weg, die Array-Paginierung in PHP zu implementieren Der beste Weg, die Array-Paginierung in PHP zu implementieren May 04, 2024 pm 02:39 PM

Es gibt zwei gängige Methoden zum Paginieren von PHP-Arrays: Verwenden der Funktion array_slice(): Berechnen der Anzahl der zu überspringenden Elemente und Extrahieren des angegebenen Elementbereichs. Verwenden Sie integrierte Iteratoren: Implementieren Sie die Iterator-Schnittstelle, und die Methoden rewind(), key(), current(), next() und valid() werden verwendet, um Elemente innerhalb des angegebenen Bereichs zu durchlaufen.

See all articles