在Ext Js 4.2中具有checklist和Select all options的组合框

在Ext JS 4.2中，可以通过使用组合框（ComboBox）来实现具有checklist和Select all options的功能。

组合框（ComboBox）是一个可编辑的文本框，同时也是一个下拉列表框。它可以让用户从预定义的选项中选择一个值，也可以输入自定义的值。在Ext JS 4.2中，可以通过配置组合框的模式（mode）为多选模式（multi）来实现checklist的功能。

以下是一个示例代码，展示了如何在Ext JS 4.2中创建具有checklist和Select all options的组合框：

Ext.create('Ext.form.field.ComboBox', {
    fieldLabel: '选择选项',
    store: ['选项1', '选项2', '选项3', '选项4', '选项5'],
    queryMode: 'local',
    displayField: 'text',
    valueField: 'value',
    multiSelect: true,
    tpl: Ext.create('Ext.XTemplate',
        '<tpl for=".">',
        '<div class="x-boundlist-item">',
        '<input type="checkbox" class="x-combo-checker"/>',
        '{text}',
        '</div>',
        '</tpl>'
    ),
    listeners: {
        afterrender: function(combo) {
            var selectAll = combo.getPicker().el.createChild({
                tag: 'div',
                html: '全选',
                cls: 'x-boundlist-item'
            });
            selectAll.on('click', function() {
                combo.setValue(combo.getStore().collect('value'));
            });
        }
    },
    renderTo: Ext.getBody()
});

在上述代码中，我们创建了一个组合框，并配置了以下属性：