EXTJS v4 を使用して、リモート クエリから返されたすべてのレコードで、複数選択コンボボックスの VALUE フィールドを更新したいと考えています。私の場合、「valueField」エントリではなく複数選択の「value」フィールドを更新し、コンボ リストのデータベース クエリから返されたリスト内の値を強調表示します。コンボボックスの場合、次のような構成エントリで実行するようにコンボを設定した場合:
displayField: 'TABLENAME', valueField: 'TABLENAME', value: ['table1', 'table2', 'table5'],
コンボが作成されたときにコンボを開くと、これらの 3 つのエントリが強調表示されます。
リモート呼び出しを行い、返された値のリストを取得し、それらをコンボボックスに戻して、コンボボックスで強調表示されたエントリとして表示したいと考えています。
これは私がこれまでに持っているものです:
[code]
Ext.Ajax.request({
url : 'app/store/dbcall/target/GG/table_list_containing_target_svc.php',
params : { groupflavor_sn: theGroupFlavor_sn, familyName: familyName },
method : 'POST',
success : function(response, theRecord) {
var res = Ext.JSON.decode(response.responseText);
var returnedTablesData = res.data;
// reurned values are either 'blank', or a list of tablenames formatted as JSON.
// JSON responses will look like this:
// {"data":[{"TABLENAME":"TABLE_A1"},{"TABLENAME":"TABLE_A1B"},{"TABLENAME":"TABLE_A5"}]}
// combobox object:
/*
var msForm = Ext.widget('form', {
title: 'Tables found for ' + selectedFamily,
//width: 385,
height: 150,
bodyPadding: 10,
id: 'msForm',
layout: 'fit',
items:[{
xtype: 'combobox',
id: 'myTablesComboId',
name: 'myTargets',
maxHeight: 150,
width: 210,
multiSelect: true,
emptyText : "Select targets",
store: 'TableComboStore',
displayField: 'TABLENAME',
valueField: 'TABLENAME',
value: ['TABLE_A1', 'TABLE_A10B', 'TABLE_A5'], //<- this is what will be highlighted in the combo list
forceSelection: false,
editable: false,
queryMode: 'local',
ddReorder: true,
triggerAction: 'all',
listeners: {
'click': function() {
if (selectedFamily) {
console.log('family selected, and button clicked');
}
}
},
listConfig: {
getInnerTpl: function(displayField) {
return '<tpl for="."><div><img src="' + Ext.BLANK_IMAGE_URL + '" ' + 'class="ux-checkboxlistcombo-icon">{' + (displayField || 'text') + ':htmlEncode}</div></tpl>';
}
}
}]
})
*/
// Post value to field
Ext.getCmp('theTargetLabel').setValue(theGroupFlavor);
if (res.data === 'blank') {
console.log("res.data === 'blank'");
// Entry is found in the database, so clear all values, and ask to resend
var theTableCombo = Ext.getCmp('myTablesComboId');
Ext.getCmp('theTargetLabel').setValue(' ');
theTableCombo.clearValue();
}
else {
// list of available tables returned as JSON
// populate list returned into the new table combo, and update with the existing list of tables
// values returned will be HIGHLIGHTED and the checkbox next to value will be CHECKED in the listing
var theTableCombo = Ext.getCmp('myTablesComboId');
var store = theTableCombo.getStore();
theTableCombo.setValue(returnedTablesData); // this works partially, to return all records found, but they are not highlighted in the combo list
//theTableCombo.setValue(store.getAt(0).get('TABLENAME')); // this works partially - record is highlighted in combo list, but only returns the first record
}
});
[/code]
「else」ステートメントに到達するとわかるように、コンボにポストバックできるテーブルのリストがあります。しかし、リストが返されますが、それらはコンボ テキスト フィールドにのみ表示され、コンボを開いたときに値が強調表示されません。
theTableCombo.setValue(store.getAt(0).get('TABLENAME')); を使用すると、返された最初のレコードを取得してコンボでそのレコードを強調表示できますが、最初のレコードのみです。強調表示されたエントリとして、返されたすべてのレコードがコンボに表示されるようにします。