Combo коробка помещается рядом с текстовым полем с помощью ExtJS

Question

Мой код:

var mpanel = new Ext.Panel({ 
     baseCls: 'x-plain', 
     //layout: 'anchor', 
     width: 290, 
     height: 500, 
     items: [{ 
      { 
       width: 140, 
       border: 1, 
       readOnly: true, 
       value: "combovalue", 
       style: { 
        borderColor: 'black', 
        borderStyle: 'solid', 
        float: 'left' 
       }, 
       xtype: 'textfield', 

      }, { 

       name: 'comp', 
       id: 'compId', 
       bodyStyle: 'margin-left:140px' 
       triggerAction: 'all', 

       mode: 'local', 
       store: new Ext.data.SimpleStore({ 

        fields: [ 
         'myId', 
         'displayText' 
        ], 
        data: [ 
         [1, 'item1'], 
         [2, 'item2'] 
        ] 
       }), 

       displayField: 'displayText', 
       xtype: 'combo', 

      }] 
     }) 

здесь я хочу текстовое поле с шириной 140px и рядом с ним, я хочу, чтобы поместить выпадающий так я включил CSS запас налево: 140px, но стиль не добавляется.

Как это решить?

Answer 1

Оберните оба поля в поле HBox layout, поместите текстовое поле слева (первый элемент) и комбинацию справа (второй элемент). Не забудьте удалить весь стиль, который вы установили в css или в настройке «стиль».