Question

我已使用tpl为添加了快速提示（工具提示），

'<tpl for="."><div ext:qtip="{text}" class="x-combo-list-item">{text}</div></tpl>'

但是在添加之后，组合框不会标记（蓝色）所选条目。即，在我添加工具提示之前，可以看到所选条目已标记或已选中（对我来说是蓝色）。但现在它不起作用（所选择的作品没有看到被选中）。这是我的代码，

            {           
              name          : name,
              hideOnSelect  : false,
              triggerAction : 'all',
              mode          : 'local',
              width         : size,
              tpl           :'<tpl for="."><div ext:qtip="{text}" class="x-combo-list-item">{text}</div></tpl>',
              store         : new Ext.data.SimpleStore({
              id                : 0,
              fields            : ['value','text'],
              data          : data
              }),
              listWidth     : 400,
              valueField    : 'value',
              displayField  : 'text'
            }

enter image description here ＆lt; ---之前＆lt; ---之后

必须得到任何帮助...谢谢。

Answer 1

displayTpl也应该有效：

{           
      name: name,
      hideOnSelect: false,
      triggerAction: 'all',
      mode: 'local',
      width: size,
      store: new Ext.data.SimpleStore({
          id: myCombo,
          fields: ['value','text'],
          data: data
      }),
      listWidth: 400,
      valueField: 'value',
      displayField: 'text',
      displayTpl: '<tpl for="."><div ext:qtip="{text}">{text}</div></tpl>'
}

<强>更新

发现问题！你必须先启动QuickTips。其余的代码很好！这是一个有效的fiddle

Ext.QuickTips.init();
var cb = new Ext.form.ComboBox({
    name: name,
    hideOnSelect: false,
    triggerAction: 'all',
    mode: 'local',
    width: 200,
    store: new Ext.data.JsonStore({
        id: "myCombo",
        fields: ['value', 'text'],
        data: [
            { value: 1, text: 'one'},
            { value: 2, text: 'two'},
            { value: 3, text: 'three'}
        ]
    }),
    listWidth: 250,
    valueField: 'value',
    displayField: 'text',
    renderTo: Ext.getBody(),
    tpl: '<tpl for="."><div ext:qtip="{text}" class="x-combo-list-item">{text}</div></tpl>'
});

Answer 2

你可以试试这个......

        {           
          name          : name,
          hideOnSelect  : false,
          triggerAction : 'all',
          mode          : 'local',
          width         : size,
          store         : new Ext.data.SimpleStore({
          id                : myCombo,
          fields            : ['value','text'],
          data          : data
          }),
          listWidth     : 400,
          valueField    : 'value',
          displayField  : 'text',
          listConfig: {
               getInnerTpl: function() {
                 return '<div data-qtip="{text}">{value}</div>';
               }
           }

        }

Multiselect Combobox和tpl - 在Ext JS中标记所选条目的问题

2 个答案: