ExtJSのコンボボックス私はFormPanelにコンボボックスを使用しようと

Question

選択し、それはこのように定義されています

 
     xtype:   'combo', 
     name:   'Reasons', 
     store:   new Ext.data.ArrayStore({ 
     id:  0, 
     fields: [ 'myId', 'displayText' ], 
     data: [ [ 1, 'Reason 1' ], [ 2, 'Second Reason' ], [ 3, 'Something else' ] ] 
     }), 
     typeAhead:  false, 
     mode:   'local', 
     valueField:  'myId', 
     displayField: 'displayText', 
     allowBlank:  false, 
     editable:  false, 
     forceSelection: true 

私は偽の私はできないと編集できていたときに、通常のselect要素のように行動したいと思いますもう一度再選択するには、true（デフォルト）として再選択するために選択範囲を削除する必要があります（バックスペースまたは削除によって）。

私はコンボボックスを選択したり縮小したりするために、他のコンポーネントを使用することを検討しますか？

普通のセレクトが必要なのであれば気になります。（普通ではありません - オプションを保存して操作するのはとてもクールです） - comboxは次のレベルの要素です。 comboxは入力として矢印下に画像を表示してレンダリングされます。

私の質問は次のとおりです：ExtJSエレメントは選択タグとして使用されていますか？

Answer 1

トリックは、triggerAction: 'all'を使用することです。下矢印アイコン（トリガー）をクリックすると、コンボドロップダウンが強制的にすべてのアイテムを表示します。

これはおそらく、ExtJSの最も直感的な設定オプションです。そして、ドキュメントを読むことによって実際に何ができるかを理解することは不可能です。そしてあなたが言うように、単純なコンボを得るためには、たくさんの設定オプションを指定しなければなりません。

ExtJSの皆さんはこれをExtJS 4で修正することを約束しましたが、それまではあなたのアプリで最も頻繁に必要な方法で設定された独自のComboBoxクラスを作成することをお勧めします。例えば、私は私の現在のプロジェクトでは、このようなものを持っている：

/** 
* Simple combo, that just allows to choose from a list of values. 
*/ 
var StaticComboBox = Ext.extend(Ext.form.ComboBox, { 
    mode: 'local', 
    triggerAction: 'all', 
    editable: false, 
    valueField: 'value', 
    displayField: 'label', 
    /** 
    * @cfg {[[String]]} data 
    * Items in combobox as array of value-label pairs. 
    */ 
    data: [], 

    initComponent: function() { 
    this.store = new Ext.data.ArrayStore({ 
     fields: ['value', 'label'], 
     data: this.data 
    }); 
    StaticComboBox.superclass.initComponent.call(this); 
    } 
}); 

私はわずか数行で簡単なコンボを作成することができることを持つ：

new StaticComboBox({ 
    name: 'Reasons', 
    data: [ 
    [1, 'Reason 1'], 
    [2, 'Second Reason'], 
    [3, 'Something else'] 
    ] 
});