我想在组合的存储中添加一个选择所有项是一个坏主意 - 插件变得依赖于商店中的数据。
***将其添加到下拉列表并编辑插件，添加触发器：

  afterrender：function （）{
 combo.container.on（{
 click：function（e）{
 var el = e.getTarget（'div'，3，true）; 
 if （el.getAttribute（'action'）=='select-all'）{
 if（！allSelected）{
 combo.select（combo.getStore（）。getRange（））; 
 combo.setSelectedCount（combo.getStore（）。getRange（）。length）; 
 el.setHTML（'Deselect all ...'）; 
 allSelected = true; 
} else { 
 combo.reset（）; 
 el.setHTML（'Select all ...'）; 
 allSelected = false; 
} 
} 
} 
}）
} 
 

Ext.each

查看完整示例 jsfiddle

在插件的init 'function：

  Ext.apply（combo，{
 listConfig：{
 tpl：new Ext。 XTemplate（
'< div action =select-allclass =sel-all>全选...< / div>< tpl for =。 =x-boundlist-item> {name}< div class =chkbox>< / div>< / div>< / tpl>'
）
} 
}）; 
 

然后不必在每个组合框中描述listConfig。
jsfiddle的链接已更新。

Update2：

，其中包含工具栏： http://jsfiddle.net/dFEsc/16/

I have an ExtJS Combobox and the requirement is to have an additional value where the user can select all the options from the first value like so:

Ext.onReady(function () {
    // The data store containing the list of states
    var states = Ext.create('Ext.data.Store', {
        fields: ['abbreviation', 'name'],
        data: [{
            name: 'Select all',
            abbreviation: 'ALL'
        },
        {
            name: 'ALABAMA',
            abbreviation: 'AL'
        }, {
            name: 'ALASKA',
            abbreviation: 'AK'
        }, {
            name: 'AMERICAN SAMOA',
            abbreviation: 'AS'
        }, {
            name: 'ARIZONA',
            abbreviation: 'AZ'
        }, {
            name: 'ARKANSAS',
            abbreviation: 'AR'
        }, {
            name: 'CALIFORNIA',
            abbreviation: 'CA'
        }, {
            name: 'COLORADO',
            abbreviation: 'CO'
        }, {
            name: 'CONNECTICUT',
            abbreviation: 'CT'
        }, {
            name: 'DELAWARE',
            abbreviation: 'DE'
        }, {
            name: 'DISTRICT OF COLUMBIA',
            abbreviation: 'DC'
        }, {
            name: 'FEDERATED STATES OF MICRONESIA',
            abbreviation: 'FM'
        }, {
            name: 'FLORIDA',
            abbreviation: 'FL'
        }, {
            name: 'GEORGIA',
            abbreviation: 'GA'
        }, {
            name: 'GUAM',
            abbreviation: 'GU'
        }, {
            name: 'HAWAII',
            abbreviation: 'HI'
        }, {
            name: 'IDAHO',
            abbreviation: 'ID'
        }, {
            name: 'ILLINOIS',
            abbreviation: 'IL'
        }, {
            name: 'INDIANA',
            abbreviation: 'IN'
        }, {
            name: 'IOWA',
            abbreviation: 'IA'
        }, {
            name: 'KANSAS',
            abbreviation: 'KS'
        }, {
            name: 'KENTUCKY',
            abbreviation: 'KY'
        }, {
            name: 'LOUISIANA',
            abbreviation: 'LA'
        }, {
            name: 'MAINE',
            abbreviation: 'ME'
        }, {
            name: 'MARSHALL ISLANDS',
            abbreviation: 'MH'
        }, {
            name: 'MARYLAND',
            abbreviation: 'MD'
        }, {
            name: 'MASSACHUSETTS',
            abbreviation: 'MA'
        }, {
            name: 'MICHIGAN',
            abbreviation: 'MI'
        }, {
            name: 'MINNESOTA',
            abbreviation: 'MN'
        }, {
            name: 'MISSISSIPPI',
            abbreviation: 'MS'
        }, {
            name: 'MISSOURI',
            abbreviation: 'MO'
        }, {
            name: 'MONTANA',
            abbreviation: 'MT'
        }, {
            name: 'NEBRASKA',
            abbreviation: 'NE'
        }, {
            name: 'NEVADA',
            abbreviation: 'NV'
        }, {
            name: 'NEW HAMPSHIRE',
            abbreviation: 'NH'
        }, {
            name: 'NEW JERSEY',
            abbreviation: 'NJ'
        }, {
            name: 'NEW MEXICO',
            abbreviation: 'NM'
        }, {
            name: 'NEW YORK',
            abbreviation: 'NY'
        }, {
            name: 'NORTH CAROLINA',
            abbreviation: 'NC'
        }, {
            name: 'NORTH DAKOTA',
            abbreviation: 'ND'
        }, {
            name: 'NORTHERN MARIANA ISLANDS',
            abbreviation: 'MP'
        }, {
            name: 'OHIO',
            abbreviation: 'OH'
        }, {
            name: 'OKLAHOMA',
            abbreviation: 'OK'
        }, {
            name: 'OREGON',
            abbreviation: 'OR'
        }, {
            name: 'PALAU',
            abbreviation: 'PW'
        }, {
            name: 'PENNSYLVANIA',
            abbreviation: 'PA'
        }, {
            name: 'PUERTO RICO',
            abbreviation: 'PR'
        }, {
            name: 'RHODE ISLAND',
            abbreviation: 'RI'
        }, {
            name: 'SOUTH CAROLINA',
            abbreviation: 'SC'
        }, {
            name: 'SOUTH DAKOTA',
            abbreviation: 'SD'
        }, {
            name: 'TENNESSEE',
            abbreviation: 'TN'
        }, {
            name: 'TEXAS',
            abbreviation: 'TX'
        }, {
            name: 'UTAH',
            abbreviation: 'UT'
        }, {
            name: 'VERMONT',
            abbreviation: 'VT'
        }, {
            name: 'VIRGIN ISLANDS',
            abbreviation: 'VI'
        }, {
            name: 'VIRGINIA',
            abbreviation: 'VA'
        }, {
            name: 'WASHINGTON',
            abbreviation: 'WA'
        }, {
            name: 'WEST VIRGINIA',
            abbreviation: 'WV'
        }, {
            name: 'WISCONSIN',
            abbreviation: 'WI'
        }, {
            name: 'WYOMING',
            abbreviation: 'WY'
        }]
    });

    Ext.define('comboSelectedCount', {
        alias: 'plugin.selectedCount',
        init: function (combo) {

            var fl = combo.getFieldLabel();

            combo.on({
                select: function (me, records) {

                    var len = records.length,
                        store = combo.getStore();

                    // toggle all selections
                    Ext.each(records, function (obj, i, recordsItself) {
                        if (records[i].data.abbreviation === 'ALL') {
                            len = store.getCount();
                            combo.select(store.getRange());
                        }
                    });

                    me.setFieldLabel(fl + ' (' + len + ' selected)');
                },
                beforedeselect: function (me, record, index) {
                    me.setFieldLabel(fl);
                }
            })
        }
    });

    // Create the combo box, attached to the states data store
    Ext.create('Ext.form.ComboBox', {
        disabled: false,
        plugins: ['selectedCount'],
        fieldLabel: 'Choose State',
        labelAlign: 'top',
        store: states,
        queryMode: 'local',
        editable: false,
        displayField: 'name',
        valueField: 'abbreviation',
        renderTo: Ext.getBody(),
        multiSelect: true,
        maxSelections: 3,
        width: 400,
        displayTpl: '<tpl for=".">' +
            '{name}' +
            '<tpl if="xindex < xcount">, </tpl>' +
            '</tpl>',
        listConfig: {
            itemTpl: '{name} <div class="chkbox"></div>'
        },
        listeners: {
        }
    });

});

I want to be able to de-select all when the user either un-checks 'Select all' or selects any other item but 'Select all'.

Can't really figure out how to do this?

JSFiddle here: http://jsfiddle.net/dFEsc/1/

I think to add a "select all" item in store of combo is a bad idea - plugin becomes dependent on the data in the Store. It is better to add it to the dropdown list and edit the plugin, add the trigger:

afterrender: function () {
    combo.container.on({
        click: function(e) {
            var el = e.getTarget('div', 3, true);
            if(el.getAttribute('action') == 'select-all') {
                if( ! allSelected) {
                    combo.select(combo.getStore().getRange());
                    combo.setSelectedCount(combo.getStore().getRange().length);
                    el.setHTML('Deselect all...');
                    allSelected = true;
                }else{
                    combo.reset();
                    el.setHTML('Select all...');
                    allSelected = false;
                }
            }
        }
    })
}

Ext.each(records ... - it is all nonsense ...

See full example on jsfiddle

Update:

I also think that adding a tpl to the field is also better to make a plugin for it to be added to any combo box to add the plugin.

In plugin 'init' function:

Ext.apply(combo, {
    listConfig: {
        tpl : new Ext.XTemplate(
            '<div action="select-all" class="sel-all">Select all...</div><tpl for="."><div class="x-boundlist-item">{name} <div class="chkbox"></div></div></tpl>'
        )
    }
});

Then not have to describe listConfig each combobox. Link on jsfiddle updated too.

Update2:

Variant with toolbar: http://jsfiddle.net/dFEsc/16/