ホームページ >ウェブフロントエンド >jsチュートリアル >jquery ashx 非リフレッシュ GridView データ表示プラグイン(ページング、ソート、フィルタリング機能を実装)_jquery

jquery ashx 非リフレッシュ GridView データ表示プラグイン(ページング、ソート、フィルタリング機能を実装)_jquery

WBOY
WBOYオリジナル
2016-05-16 18:28:461005ブラウズ

理由: jquery はシンプルで、互換性が高く、パッケージ化が簡単です。早速、Jquery プラグインの作成を始めましょう。似たようなプラグインを書いている人はたくさんいるはずで、私もいくつかの点で flexGrid を真似しました。

要件: GridView は、ASP.NET に基づいてデータを表示します。ページングの更新、並べ替えの更新、フィルター処理 (データの検索) の更新はありません (実装するための ashx 一般処理ファイルがここにあります)。

使用するテクノロジー: asp.net2.0、jquery、css

最初に jquery プラグインについて書きます。使用されるコア関数は jquery の ajax 関数です。便利で速い。

コードをコピー コードは次のとおりです。

$.ajax({
type : p.メソッド、
url: p.url、
data:param、
成功: function(msg){
$.AddData(msg,showbox,p);
エラー: function(msg){$.ErrorAjax(showbox,p.errorMsg);}、
beforeSend:function(){$.AddLoading(showbox);}、
complete:function(){ $.MoveLoading (ショーボックス);}
});
このような簡単な文章を読むと、jquery がさらに楽しくなります。特定のコードを表示するには、以下の添付ファイルをダウンロードしてください。
まず、生成された結果の写真を投稿して確認してください (スタイルはあまり見栄えがよくありません。必要に応じて自由に修正してください)

並べ替えとフィルター機能

jquery ashx 非リフレッシュ GridView データ表示プラグイン(ページング、ソート、フィルタリング機能を実装)_jquery

jquery ashx の非リフレッシュ ページング関数

jquery ashx 非リフレッシュ GridView データ表示プラグイン(ページング、ソート、フィルタリング機能を実装)_jquery

実際、プラグイン全体の主要な構造として機能する jquery に加えて、ここでのもう 1 つの重要なファイルは、一般的な処理ファイル ashx です。 ashx は、jqueryGrid プラグイン全体で {n page:1,ntotal:0,pages:1,rows:'',cols:''} のような json コードを出力します。josn を使用したことのある友人なら理解できると思います。エラーを減らすために、サードパーティのプラグイン Newtonsoft.Json を使用しました。これは、JSON 文字列をフォーマットする JsonConvert.DeserializeObject() 関数です。

jquery ashx 非リフレッシュ GridView データ表示プラグイン(ページング、ソート、フィルタリング機能を実装)_jqueryもちろん、この機能的なプラグインは Web アプリケーションや社内 Web サイトでの使用に適していますが、結局のところ、SEO の観点から見ると、jquery によって直接生成されたデータは適切な表示方法ではありません。 。あまり言うことはありませんが、私のコードを見てください。このプラグインに関するより良い提案や変更がある場合は、共有してください。

jquery ashx 更新なし GridView データ表示プラグインのダウンロード

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。