Question

我有ExtJs组合下拉列表。当组合为span

时，我想要双色（奇数为红色，甚至为绿色）行列表

注意：单行有多行（多行）

ExtJS 4.2可以实现吗？如果是的话我该怎么办呢。

                                {       xtype: 'combobox',
                                        id: 'mycbo',
                                        itemId: 'mycbo',
                                        fieldLabel: 'Name',
                                        name: 'id',
                                        tabIndex: 5,
                                        allowBlank: false,
                                        displayField: 'NAME',
                                        forceSelection: true,
                                        queryMode: 'local',
                                        store: 'STORE',
                                        valueField: 'ID'
                                    },

Answer 1

您应该使用listConfig配置来更改组合框选择器的行为。（有关更多信息：http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.form.field.ComboBox-cfg-listConfig）

在下面的代码段中，我将组'odd'和'even'设置为组合框中的每个选项。然后我可以用CSS设置它。

Ext.create('Ext.form.ComboBox', {
    fieldLabel: 'Choose State',
    store: states,
    queryMode: 'local',
    displayField: 'name',
    valueField: 'abbr',
    listConfig: {
        getInnerTpl: function(displayField) {
           return '<tpl if="xindex%2==0"><div class="odd"></tpl><tpl  if="xindex%2==1"><div class="even"></tpl> {' + displayField + '} </div>';
        }
    },
    renderTo: Ext.getBody()
});

Answer 2

在这里查看自定义项模板示例 - http://docs.sencha.com/extjs/4.2.0/#!/example/form/combos.html并查看源代码以及如何使用listConfig。

您应该能够使用此方法实现出现的列表项的自定义样式

具有两个颜色行的ExtJs下拉列表

2 个答案: