JQuery EasyUIのdatagrid統合Struts 2の実装2(ページング、ソート、クエリー)

2891 ワード
DAO jquery
下一篇:JQuery EasyUIのdatagrid統合Struts 2の実装一(基本実装)
 
 
前編では、時間が限られていて、基礎的な実現を紹介しただけです.ほとんどの人はそれが簡単だと思います.このようなアプリケーションでは、個人的に難点を感じているのも、公式APIで明確な点が言われていないためであり、クエリーとソートをどのように確立するかである.
ここでは、ページング、クエリー、ソートから簡単に説明します.
 
 
1.ページング.
 
JQuery EasyUIのdatagridでは、APIから見ると、pageとrowsの2つの基本パラメータがサービス側から取得できます.Page:現在のページ番号です.rows:ページごとのサイズで、pageSizeに相当します.したがってstruts 2によるページングは難しくなく、直接actionで2つのパラメータを定義します.
private int page;
private int rows ;
 
これにより、現在のページと各ページの合計数を取得できます.これにより、ページング機能が実現されます.
 
2.クエリーとソート.
最初はeasyUIでプロジェクトをしていたとき、どのようにソートしたり、挿入したりするかが一番分かりませんでした.もしかしてeasyuiソースを変更しますか?それともurlにパラメータを追加しますか?あるいはURLを変更することでデータを更新しますか?いろいろ考えました.しかし、結局しなかった.
言っても面白いですが、私は昼寝のおかげで、昼寝の中で、私は夢の中で突然この機能を実現する方法を思い出しました.目が覚めると、まだ記憶があるうちにできるようになり、成功しました.この点は私自身も驚いた.
APIにはパラメータqueryParams:{}が提供されており、このパラメータオブジェクトを拡張することを考えています.ソートとクエリーが必要なので、このオブジェクトをデフォルトで{"sortName":"","sortOrder","queryWord":","queryType":""}
sortName:ソートフィールド、
sortOrder:ソート方法:asc|desc
QueryWord:キーワードの問合せ
QueryType:クエリーフィールド.
 
このqueryParamsは、テーブルのリフレッシュ時に自動的にサービス側に付属します.そのため、サービス側は受信する必要があります.
Actionでいくつかの受け入れパラメータを定義する
private String sortName;
private String sortOrder;
private String queryWord;
private String queryType;
以上は注意が必要ですが、最初はqueryParamsでパラメータを取得しようと思っていたのですが、そうではないことが証明されました.
 
 
 
jsでクエリーを実装する方法について説明します.
まず、挿入ウィンドウを定義します.2つの入力パラメータがあります.queryWord,queryType
function query(queryWord,queryType){

var queryParams = $('#test').datagrid('options').queryParams;
//  queryParams      。
queryParams.queryWord = queryWord;
queryParams.queryType = queryType;

$('#test').datagrid('reload');

}

 
これにより、クエリーにページが含まれていることがわかります.つまり、ページ分けの問題を考える必要はありません.
 
ソート:ここでdatagridソートは、すでにデータを取り出したソートではなく、サービス側から送信されたデータをソートします.
ソート関数を書く必要があります
function sort(sortName,sortOrder){

    var queryParams = $('#test').datagrid('options').queryParams;
    queryparams.sortName = sortName;
    queryaParams.sortOrder = sortOrder;
 
    $("#test").datagrid('reload');
    
}

 
方法はありますが、どうやって呼び出しますか.APIドキュメントを再確認し、EVENT:onSortColumn(sort,order)を発見する必要があります.
ここではこのイベントをdatagridの初期化に追加します
 
onsortColumn:function(sort,order){
    sort(sort,order);//ソート方法を呼び出します.
}
 
これで基本的にOKです.
 
Actionでは,DAO層でデータを抽出する方法に並べ替えやクエリーのパラメータを多く加えるだけでよい.
 
 
利点:ここでは、クエリーとソートが同じページで同じactionを呼び出すように簡単な操作を行います.また、クエリーもソート結果もページングできます.また、ソートした結果をクエリーしたり、クエリーの結果をソートしたりすることができます.
JqueryアクションSelect
JAvascriptノート:javascript内のオブジェクトの作成を深く分析する(上)