Javascript ExtJS组合框-显示；任何；选择所有项目时，在字段中

我在ExtJS中有一个ComboBox组件，我正在使用它作为过滤器

用户可以选择多个项目（multiSelect:true）。选择这些值后，它们将正确显示在字段中。未选择任何项目时，将显示emptyText属性的值

现在，有没有一种简单的方法可以在选择所有选项后定义案例的文本？像allSelectedText这样的东西

这是ComboBox的一个简单定义：

Ext.create('Ext.form.ComboBox', {
    multiSelect: true,
    fieldLabel: "Select item",
    emptyText: "Please select",
    store: Ext.create('Ext.data.Store', {
        fields: ['abbr', 'name'],
        data: [
            {"id": "1","name": "Item 1"}, 
            {"id": "2","name": "Item 2"},
            {"id": "3","name": "Item 3"}
        ]}),
    queryMode: 'local',
    displayField: 'name',
    valueField: 'id',
    renderTo: Ext.getBody(),
});

这就是它现在的样子：

这就是我想看到的：

我已经设法与标签（字段旁边）交互，但是我找不到简单的方法来更改输入元素的内容

以下是JSFIDLE：

---

非常感谢

要做到这一点，没有简单的方法，但可以创建小型解决方案：

listeners: {
    'select': function(cmp, rec){
        var store = cmp.getStore(),
            values = cmp.getValue();

        if(store.getCount() == values.length) {
            cmp.setValue('All');                  
        }
    }
}

---

在花了很多时间之后，这里有一个简单的解决方案

Ext.define('AnySelectedCombo', {
   extend: 'Ext.form.ComboBox',
   alias: 'widget.anyselectedcombo',
   cls: "cst-filter",
   allSelectedText: "All", // default

   getDisplayValue : function() {
      // Check if all items are selected
      if (this.getStore() && this.value && (this.value.length > 0) && (this.getStore().getCount() == this.value.length)) {
        return this.allSelectedText;
      }
      // Otherwise return as normally
      return this.callParent(arguments);
   }
});

---

JS小提琴：非常感谢帕维尔。但是，它会更改字段的值，从而触发其他事件，例如更改。此外，在您选择最后一个项目后，下拉列表中的项目将立即取消选择。欢迎您。确实，此操作会触发其他事件。可能可以使用suspendEvent/resumeEvent函数创建变通方法。抱歉，错误地发送了上一条消息。如果在suspendEvent和resumeEvent之间写入setValue函数，则可能不会激发changeEvent。对于选择问题，您需要手动检查列表中的所有值，并将“selected”类添加到每个元素中。