1

そのため、テキスト フィールドと同じ行に 2 つの値を持つコンボボックスを追加しようとしていますが、うまくいきません。

これは今のように見えます： ここに画像の説明を入力

私が持っている2つのテキストフィールドの左側にコンボボックスを移動できるようにしたい.

これは、フォームパネルの外に配置したコンボボックスのコードです。

var cbTemplate = new Ext.form.ComboBox({
    typeAhead: false,
    width: 125,
    hideTrigger:true,
    allowBlank: true,
    displayField: 'val',

});

// ComboBox for switching status
var carWeightData={lstValueRecords: [{val: 'Item 1'},{val: 'Item 2'}]};
var cbCombo = jQuery.extend(true, {}, cbTemplate);
cbCombo.id = 'cbCarWeight';
cbCombo.name = 'cbCarWeight';
cbCombo.emptyText = 'Please Select';
cbCombo.hideTrigger = false;
cbCombo.mode = 'local';
cbCombo.triggerAction = 'all';
cbCombo.store = new Ext.data.Store({
    data: comboData,
    reader: new Ext.data.JsonReader({
        root: 'lstValueRecords',
        fields: [
                    {name: 'val', mapping: 'val'}
                ]
    })
});

そのため、テキスト フィールドと同じ行に 2 つの値を持つコンボボックスを追加しようとしていますが、うまくいきません。

これが現在の外観です: コンボボックス

私が持っている2つのテキストフィールドの左側にコンボボックスを移動できるようにしたい.

これは、フォームパネルの外に配置したコンボボックスのコードです。

var cbTemplate = new Ext.form.ComboBox({
    typeAhead: false,
    width: 125,
    hideTrigger:true,
    allowBlank: true,
    displayField: 'val',

});

// ComboBox for switching status
var carWeightData={lstValueRecords: [{val: 'Item 1'},{val: 'Item 2'}]};
var cbCombo = jQuery.extend(true, {}, cbTemplate);
cbCombo.id = 'cbCarWeight';
cbCombo.name = 'cbCarWeight';
cbCombo.emptyText = 'Please Select';
cbCombo.hideTrigger = false;
cbCombo.mode = 'local';
cbCombo.triggerAction = 'all';
cbCombo.store = new Ext.data.Store({
    data: comboData,
    reader: new Ext.data.JsonReader({
        root: 'lstValueRecords',
        fields: [
                    {name: 'val', mapping: 'val'}
                ]
    })
});

これは、FormPanel 内および列内にあるテキスト フィールド部分です。

columnWidth:.6,
layout: 'form',
items: [
cbCombo,{
  xtype: 'container',
  layout: 'hbox',
  hideLabel: true,
  labelStyle: 'width: 105px',
  fieldLabel: 'Combo Data',
  anchor: '90%',
  items:[{
     xtype:'textfield',
     name: 'locationId1',
     flex: 12
  },{                       
      xtype: 'label',
      margins: '0 0 0 5',
      text:'-',
      flex: 1
  },{
      xtype:'textfield',
      name: 'locationId2',
      flex: 12
  }]

}]

とにかく、コンボボックスを下に移動してテックスフィールドの隣に置くことはできますか?

助けてください！

4

1 に答える 1

0

テキストフィールドと同じことをしてみませんか?

items: [
    {
        xtype: 'combo',
        // combobox configuration
    },{
        xtype:'textfield',
        name: 'locationId1',
        flex: 12
    },
    ...
]

インスタンス化されたコンポーネントをそこに配置することを妨げるものは何もありません。

items: [
    new Ext.form.ComboBox({
        // combobox configuration
    }),
    {
        xtype:'textfield',
        name: 'locationId1',
        flex: 12
    },
    ...
]

Ext コンポーネントを jQuery で拡張することは、私自身は控えたいと思っていますが、o_O

于 2013-08-29T13:56:41.103 に答える