Question

我正在尝试在下面的示例中正确显示组合框的标签。我试图让它在Sencha Fiddle中运作。如果文本太长，则会被截断。

Ext.application({
    name : 'Fiddle',

    launch : function() {


        // The data store containing the list of states
var states = Ext.create('Ext.data.Store', {
    fields: ['abbr', 'name'],
    data : [
        {"abbr":"AL", "name":"Alabama"},
        {"abbr":"AK", "name":"Alaska"},
        {"abbr":"AZ", "name":"Arizona"}
        //...
    ]
});

// Create the combo box, attached to the states data store
Ext.create('Ext.form.ComboBox', {
    fieldLabel: 'Reaaaaaaaaaaaaaaallllllllly long',
    fieldlabelStyle: 'width:600px',//doesn't do anything
    store: states,
    queryMode: 'local',
    displayField: 'name',
    valueField: 'abbr',
    renderTo: Ext.getBody()
});
    }
});

Answer 1

尝试使用labelStyle

Ext.application({
    name : 'Fiddle',

    launch : function() {
        // The data store containing the list of states
        var states = Ext.create('Ext.data.Store', {
            fields: ['abbr', 'name'],
            data : [
                {"abbr":"AL", "name":"Alabama"},
                {"abbr":"AK", "name":"Alaska"},
                {"abbr":"AZ", "name":"Arizona"}
                //...
            ]
        });

        // Create the combo box, attached to the states data store
        Ext.create('Ext.form.ComboBox', {
            fieldLabel: 'Reaaaaaaaaaaaaaaallllllllly long',
            labelStyle: 'width:600px',
            //fieldlabelStyle: 'width:600px',//doesn't do anything
            store: states,
            queryMode: 'local',
            displayField: 'name',
            valueField: 'abbr',
            renderTo: Ext.getBody()
        });
    }
});

Answer 2

使用labelWidth：config。像这样定义

 labelWidth: '60%',

如何设置EXTJS Combobox标签宽度

2 个答案: