ものすごく久々にExtJS勉強会に参加しました。
-----
WorkShopにもそろそろ復活しようかと。
-----
さて、今日はビール片手にえらく久々にExtJSをさわってまして、
今日はComboboxを。DBから持ってきた値で実装。と、例のごとくです。
ユーザ情報のマスタとプロジェクト情報のマスタと二つほど
Comboboxコントロールを作ってました。
先日買った本をよんで、ふむふむ。と。
で、
-----
Commboboxのコンフィグで
displayField
valueField
なんてあるから
あ、表示はdisplayField
で選択されたデータの紐付けは
valueField
で、これでサブミットされる値はOK。ですな。
なんて、早とちり。。
実際、サブミットされるのはtype=textになってて選択
表示されているテキストになってた。
で、あれれ？選択されたIDをサブミットしたいんだけど？
となるわけですが、
http://extjs.com/forum/showthread.php?p=296133
こちらでちゃんと解説していただいてました。。。
hiddenNameにサブミットする名前を設定しないといけないみたいです？
valueField
はサブミットする際の値となるフィールドを指定する。
が正解なようで。
//----------------------------------------
// record
//----------------------------------------
System.Common.Form.ProjectComboBoxRecord = [
{name: 'id', mapping: 'ID' },
{name: 'name', mapping: 'プロジェクト名' },
{name: 'summary', mapping: 'プロジェクト名' }
];
//----------------------------------------
// store
//----------------------------------------
System.Common.Form.ProjectComboBoxStore = new ExtWrapper.Store(
{
proxy: new ExtWrapper.Proxy({
url:'/PersonalGardenSolution/SystemClasses/readControlsData.aspx'
}),
reader: new ExtWrapper.Reader({
root: 'rows',
totalProperty: 'rowsCount',
id: 'ID'
},
System.Common.Form.ProjectComboBoxRecord
)
});
//----------------------------------------
// combo実装
//----------------------------------------
System.Common.Form.ProjectComboBox = Ext.extend( System.Common.Form.ComboBox,
{
tpl: '
{name}
typeAhead: true,
store : System.Common.Form.ProjectComboBoxStore,
initComponent : function()
{
this.valueField = 'id';
this.displayField = 'name';
System.Common.Form.ProjectComboBox.superclass.initComponent.call( this );
this.store.load({
params:{category:'SystemCommonFormProjectComboBox'}
});
}
});
Ext.reg('SystemCommonFormProjectComboBox', System.Common.Form.ProjectComboBox );
で、使用するほうでは、
{ xtype : 'SystemCommonFormProjectComboBox', fieldLabel:"XXXX", hiddenName: "XXXX", width:265 }
みたいな。
おお、できたぞ。
