Extjs подсказка для выбранных предметов MULTISELECT комбобоксе

Question

я сделал всплывающую подсказку для раскрывающихся элементов списка, как это:

listConfig: { 
       itemTpl: '<div data-qtip="{description}">{name}</div>' 
      }; 

и теперь, что подсказка для выбранных элементов, отметят, что выпадающий является MULTISELECT, и я хочу см. правильную подсказку выбранного элемента при наведении.

I что подсказка для x-tagfield-item.

Answer 1

Решение с использованием XTemplate было бы, пожалуй, лучшим. Но шаблон вызывается только тогда, когда отображается список. Таким образом, вы можете установить всплывающую подсказку, если в шаблоне только при ее открытии.

listConfig: { 
    itemTpl: new Ext.XTemplate(
     // The template if is called only when it's rendred 
     "<tpl if='this.test()'>", 
     '<div data-qtip="Not selected">{name}</div>', 
     '<tpl else>', 
     '<div data-qtip="Selected">{name}</div>', 
     '</tpl>', { 
      test: function() { 
       // debugger 
       // TODO Detect if item is selected render different tooltip 
       return true; 
      } 
     } 
    ) 
}, 

Если вы хотите иметь динамическую подсказку на открытом списке - я решил, что с помощью выбора события и редактирования QTIP непосредственно в йот.

onComboboxSelect: function (combo, record, eOpts) { 
    var comboId = combo.getId(); 
    var alltheItems = combo.getStore().getData().items 
    var recordId, 
     query, 
     element; 

    // On each change we are going trough the all the values in the combo and set the qtip 
    // Beacuse when the item is deselect we do not get it's value in the record object 
    alltheItems.forEach(function (value) { 
     recordId = value.internalId; 
     query = Ext.String.format('#{0}-picker-listEl [data-recordid={1}] div', comboId, recordId); 
     element = Ext.dom.Query.select(query)[0]; 

     // Check if the item is in the selected list 
     if (record.some(function (e) { 
       return e.internalId == recordId 
      })) { 
      element.setAttribute('data-qtip', 'Selected'); 
     } else { 
      element.setAttribute('data-qtip', 'Not selected'); 
     } 

    }) 
}, 

Работа скрипка https://fiddle.sencha.com/#view/editor&fiddle/1lo7

Также вместо tpl if - мы могли бы использовать код из функции событий и поместить его в какое-нибудь другое событие и передать его список выбранных элементов.