PDA

View Full Version : ページングによるデータ取得



ak_ext
14 Apr 2009, 3:47 AM
extのgridにサーブレットで取得したデータを、
表示しようと思っているのですが、

ページングを使う場合についてお聞かせ下さい。

データを取得するにはhttpProxyを使います。
var firstGridStore = new Ext.data.Store({
//root: 'data',
//totalProperty: 'totalProperty',
id: 'index',
remoteSort: true,
proxy: new Ext.data.HttpProxy({url: "/sample/app?U=U_SEARCH", method: "GET"}),
reader: reader
});

そして
firstGridStore.load({params:{start:0, limit:10}});
で1ページの読込む件数を指定するのですが、

この時startとlimitをリクエストで飛ばして、
サーブレットで取得 SQLにstartとlimitを追加して、指定件数だけ取得
それが帰ってきてグリッドに表示される所まではできたのですが、
ページングのボタンが活性になりません。
おそらくページのサイズが10で取得件数が10だからだと思うのですが、
そうするとページングを実現する場合には
1回全件取得してajax側で詰めなおしをしないといけないのでしょうか。

yuki
14 Apr 2009, 4:02 AM
データを取得するにはhttpProxyを使います。
var firstGridStore = new Ext.data.Store({
//root: 'data',
//totalProperty: 'totalProperty',
id: 'index',
remoteSort: true,
proxy: new Ext.data.HttpProxy({url: "/sample/app?U=U_SEARCH", method: "GET"}),
reader: reader
});


totalPropertyを返してないからでは?

ak_ext2
14 Apr 2009, 7:12 AM
自分もtotalPropertyでextの方が、
次ページがあるかどうかを判断してると思って入れたのですが、
rootやtotalPropertyを入れるとグリッドに、
表示すらされなくなってしまいました。

json形式のストリングでデータを返してますが、フォーマットは
{'totalProperty':120,'data':{[data1:'aaa',data2:'bbb'],[data1:'ccc',data2:'ddd']...}}
です。

yuki
14 Apr 2009, 11:03 AM
{'totalProperty':120,'data':{[data1:'aaa',data2:'bbb'],[data1:'ccc',data2:'ddd']...}}




{'totalProperty':120,'data':[{data1:'aaa',data2:'bbb'},{data1:'ccc',data2:'ddd'}...]}
にしないと動かないと思いますよ。

ak_ext2
14 Apr 2009, 3:32 PM
書き方を間違えてました。
{'totalProperty':120,'data':[{data1:'aaa',data2:'bbb'},{data1:'ccc',data2:'ddd'}...]}
です。
例を調べるとキーもバリューも全部""で囲ってたり、
あるいは''だったり、どちらかしか囲ってなかったりあったのですが、
いずれも
totalProperty やrootを入れるとグリッドに出なくなりました。

yuki
14 Apr 2009, 4:08 PM
上の情報だけではちょっと何が起きているのか分かりませんね。

サンプルコード、の前に、Firebugで受信しているデータの読み込みを確認してみてください:


Storeにデータは読み込まれているか?(Storeにidを設定しておけば、Ext.StoreMgr.lookupで取得できます)
読み込まれていないのであればHttpProxyの中のload、loadResponseあたりにブレークポイントを設定して以下を確認
loadResponseは呼び出されているか(request→サーバーからの返信はあるか)?
loadexceptionイベントが発生していないか?
loadResponseの中でreaderにきちんとresponseが読み込まれているか


みたいな感じで追いかけていけば何が起きているのか分かるかと思います。

コンフィグオプションの設定ミスで、responseをreaderできちんと読み込めないというのはよくあることなので、HttpProxy.loadResponseの以下の行にブレークポイントを設定して、ステップインしていけば多分何が起きているのか分かるはずです:


try {
result = o.reader.read(response);
}catch(e){
...

ak_ext
15 Apr 2009, 9:39 PM
idを設定して、Ext.StoreMgr.lookupを実行した所オブジェクトは取得できました。
中をみてreaderにカラムなどは設定されています。

ただstoreのgetTotalCount()を実行すると0が返り、
またサーバーサイドから返ってきた文字列をレコード毎に
格納してる部分がでません。

デバッグでstore.dataの下を見たのですが、
個々の要素が格納してる場所が分かりませんでした。

ak_ext
15 Apr 2009, 10:46 PM
ext-all.jsのreadRecords で
s.totalPropertyが取得できてないのが、分かりました。
this.jsonData = oで意図した文字列が入っていて、
その後のvar s = this.metaでmataを入れてるのですが、
ここにfiledしか設定されておらずtotalPropertyが入ってません。
これはどこで設定すれば宜しいのでしょうか。

store設定時だけではないのでしょうか。
var firstGridStore = new Ext.data.Store({
root: 'data',
totalProperty: 'totalProperty',←ここ
id: 'index',
remoteSort: true,
proxy: new Ext.data.HttpProxy({url: "/sample/app?U=U_SEARCH", method: "GET"}),
reader: reader
});

readRecords : function(o){


this.jsonData = o;
if(o.metaData){
delete this.ef;
this.meta = o.metaData;
this.recordType = Ext.data.Record.create(o.metaData.fields);
this.onMetaChange(this.meta, this.recordType, o);
}
var s = this.meta, Record = this.recordType,
f = Record.prototype.fields, fi = f.items, fl = f.length;
// Generate extraction functions for the totalProperty, the root, the id, and for each field
if (!this.ef) {
if(s.totalProperty) {
this.getTotal = this.getJsonAccessor(s.totalProperty);
}
if(s.successProperty) {
this.getSuccess = this.getJsonAccessor(s.successProperty);
}
this.getRoot = s.root ? this.getJsonAccessor(s.root) : function(p){return p;};
if (s.id) {
var g = this.getJsonAccessor(s.id);
this.getId = function(rec) {
var r = g(rec);
return (r === undefined || r === "") ? null : r;
};
} else {
this.getId = function(){return null;};
}
this.ef = [];
for(var i = 0; i < fl; i++){
f = fi[i];
var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
this.ef[i] = this.getJsonAccessor(map);
}
}
var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
if(s.totalProperty){
var v = parseInt(this.getTotal(o), 10);
if(!isNaN(v)){
totalRecords = v;
}
}

ak_ext
15 Apr 2009, 11:29 PM
解決しました。設定場所を間違えてました。