1

以下のようにtplを使用して、comboxにquicktip(tooltip)を追加しました。

'<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'
            }

ここに画像の説明を入力してください<---前 ここに画像の説明を入力してください<---後

どんな助けも感謝しなければなりません...ありがとう。

4

2 に答える 2

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を初期化する必要がありました。残りのコードは問題ありませんでした。これが実用的なフィドルです

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>'
});
于 2012-11-26T11:00:10.730 に答える
0

これを試してもらえますか...

        {           
          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>';
               }
           }

        }
于 2012-11-26T06:41:01.120 に答える