Question

我有一些带有一些值的组合框。当我点击列出数据的组合时。但没有与列出的组合框和弹出窗口对齐。任何帮助

  /**
  * This is the combo box with common values
  */
  var combo_1 = Ext.extend(Ext.form.ComboBox, {
        editable:true,
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        selectOnFocus:true,
        anchor:'95%',
        forceSelection: true,
        tabIndex: 1,
        labelStyle: 'width:110px'              
    });

 /**
  * This is the form panal
  */
 var form_panal = new Ext.form.FormPanel({
         id:'form_panal',
         frame:true,
         bodyStyle:'padding:10px 10px 10px 10px',
         buttonAlign:'center',
         items: [
                 combo_1,
                 combo_2,
                 combo_3,
                 combo_4
                 ],
         buttons: [ {
                 text: 'Save',
                 handler : function(){

                       }
                     },
                    {text: 'Cancel',
                     handler : function() { 

                       }
                     }
                    ]
        });

enter image description here

Answer 1

以下是示例代码

Ext.application({
name : 'Fiddle',

launch : function() {
    var combo_1 = Ext.create('Ext.form.field.ComboBox', {
        editable:true,
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        selectOnFocus:true,
        anchor:'95%',
        forceSelection: true,
        tabIndex: 1,
        labelStyle: 'width:110px',
        displayField: 'name',
        valueField: 'name',
        store: {
            fields: [{
                name: 'name'
            }],
            proxy: {
                type: 'memory'
            },
            data: [{
                name: 'Android'
            },{
                name: 'iOS'
            }, {
                name: 'Windows'
            }]
        }
    });


      var combo_2 = Ext.create('Ext.form.field.ComboBox', {
        editable:true,
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        selectOnFocus:true,
        anchor:'95%',
        forceSelection: true,
        tabIndex: 1,
        labelStyle: 'width:110px',
        displayField: 'name1',
        valueField: 'name1',
        store: {
            fields: [{
                name: 'name1'
            }],
            proxy: {
                type: 'memory'
            },
            data: [{
                name1: 'Blue Star'
            },{
                name1: 'LLoyd'
            }, {
                name1: 'Samsung'
            }]
        }
    });


      var combo_3 = Ext.create('Ext.form.field.ComboBox', {
        editable:true,
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        selectOnFocus:true,
        anchor:'95%',
        forceSelection: true,
        tabIndex: 1,
        labelStyle: 'width:110px',
        displayField: 'name2',
        valueField: 'name2',
        store: {
            fields: [{
                name: 'name2'
            }],
            proxy: {
                type: 'memory'
            },
            data: [{
                name2: 'Andhra pradesh'
            },{
                name2: 'Telangana'
            }, {
                name2: 'Karnataka'
            }]
        }
    });
    /**
     * This is the form panal
     */

    Ext.create('Ext.form.FormPanel',{
        frame:true,
        bodyStyle:'padding:10px 10px 10px 10px',
        buttonAlign:'center',
        items: [


            combo_1,
            combo_2,
            combo_3
        ],

        buttons: [ {
            text: 'Save',
            handler : function(){

            }
        },{
            text: 'Cancel',
            handler : function() { 

            }
        }],
        renderTo: document.body
    });
}
});

Extjs组合框下拉列表未与组合框对齐

1 个答案: