2

Extjs 4を使用していて、Designer 1.2.0を使用しています。ツールチップを表示するために使用している、グリッドのレンダラー機能で問題が発生しています。グリッドはタブパネルに配置されます。タブパネルを開いたときに初めてすべてが正常に機能しますが、タブパネルを閉じて再度開くと、initComponent()が再度呼び出されないため、ツールチップが表示されず、ハイパーリンク効果がオフになります。この問題の解決策は何ですか?以下は私のコードです:

Ext.define('MyApp.view.ItemManager', {
    extend: 'MyApp.view.ui.ItemManager',

    initComponent: function() {
       Ext.QuickTips.init();
         var me = this;
         me.callParent(arguments);
              me.down('#itemManager').columns[3].renderer=function(value,metaData,record,colIndex,store,view){
                var imgpath="<img style=\'margin: 2px 0;height:150px;width:150px;\' src=\' /items/"+record.data.id +" '/>";

                metaData.tdAttr = 'data-qtip=" '+imgpath +'"' ;
                return '<a href="/items/imgdownload?id='+record.data.id+'">'+ record.data.img_filename +'</a>';
              }
      }
});

ただし、デザイナーからプロジェクトをエクスポートして生成されたUIファイルにレンダラーコードを書き込むと、すべてが正常に機能します。問題は、 UIファイルにレンダラーを書き込むと、プロジェクトをエクスポートするたびに上書きされることです:(

4

1 に答える 1

1
  1. Ext.QuickTips.init()は 1 回だけ呼び出す必要があり、グローバルな場所に再配置する必要があります。
  2. レンダリングされた定義を、それが属する実際の列に再配置する必要があります。{ ..., dataIndex : 'myColumn', rendered : function (value, metaData, etc) { return value; }, title : 'My Column Title', ... }

編集

以下に例を示します。

Ext.define('MyApp.view.ItemManager', {
    extend: 'MyApp.view.ui.ItemManager',

    initComponent: function() {
        //Ext.QuickTips.init(); // move to global js file. only call once.
        var me = this;
        me.callParent(arguments);

        if (!me.down('#itemManager').columns[3].renderer) {
            me.down('#itemManager').columns[3].renderer=function(value,metaData,record,colIndex,store,view) {
                var imgpath="<img style=\'margin: 2px 0;height:150px;width:150px;\' src=\' /items/"+record.data.id +" '/>";

                metaData.tdAttr = 'data-qtip=" '+imgpath +'"' ;
                return '<a href="/items/imgdownload?id='+record.data.id+'">'+ record.data.img_filename +'</a>';
            }
        }
    }
});
于 2011-09-28T06:29:15.527 に答える