1

JSON 形式でデータを返すリモート ストアとの ExtJS コンボがあります。最初のページ (たとえば) で値を選択してから別のページに移動すると、値ではなく選択された ID がコンボに表示されます。

選択した値を常に表示するにはどうすればよいですか?

コード:

Ext.onReady(function() {
    Ext.define('Model', {
        extend: 'Ext.data.Model',
        fields: ['title'],
        idProperty: 'threadid'
    });

    var store = Ext.create('Ext.data.Store', {
        pageSize: 50,
        model: 'Model',
        remoteSort: true,
        proxy: {
            type: 'jsonp',
            url: 'http://www.sencha.com/forum/topics-browse-remote.php',
            reader: {
                root: 'topics',
                totalProperty: 'totalCount'
            },
            simpleSortMode: true
        }
    });

    var combo = Ext.create('Ext.form.ComboBox', {
        fieldLabel: 'Value',
        store: store,
        queryMode: 'remote',
        displayField: 'title',
        valueField: 'threadid',
        pageSize: 50,
        labelWidth: 50,
        width: 300,
        padding: '60 0 0 0'
    });

    Ext.create('Ext.window.Window', {
        title: 'Hello',
        height: 200,
        width: 400,
        layout: { type: 'vbox', align: 'center' },
        items: combo
    }).show();
})​

例: http: //jsfiddle.net/coshmos/5wT6H/

詳細情報 (ケース スタディ):
レコードを更新できるテーブルがあります。アイテムをクリックすると、サーバーがデータベースから値を返します。次に、UI を含むウィンドウが表示されます。すべてのページ化されたコンボでは、ID のみが返されます。そのため、ID が返されたアイテムを含むページに移動しない限り、値は表示されません。ページングを無効にしてすべての値をロードすると、すべてが期待どおりに機能しますが、数千の値のロードは適切ではありません。

4

2 に答える 2

3

次の方法で修正できます。

Ext.override(Ext.form.field.ComboBox,{
    findRecord: function(field, value) {
        var foundRec = null;
        Ext.each(this.lastSelection, function(rec) {
            if (rec.get(field) === value) {
                foundRec = rec;
                return false; // stop 'each' loop
            }
        });
        if (foundRec) {
            return foundRec;
        } else {
            return this.callParent(arguments);
        }
    }
});

試してみてください: http://jsfiddle.net/5wT6H/3/

于 2013-01-24T18:31:03.600 に答える
1

ロジックを変更しました。さらに、コンボボックス値のIDを送信し、その後、このIDを使用してextraProxyParamsを設定し、ストアをロードします。その後、extraProxyParamsをクリーンアップします。したがって、ユーザーが別の値を検索した後、それを実行できます。

于 2012-12-17T09:40:03.147 に答える