0

これは、グリッド内のコンボボックスのコードです。

{
    header: 'FSCS',
    dataIndex: 'acntOvrrideTypeCd',
    flex: 1,
    renderer: function(val, metaData, record, rowIndex, colIndex) {
        var id = Ext.id();
        var store = new Ext.data.Store({
            fields: ['code', 'description'],
            data: [{
                "code": "",
                "description": ""
            }, {
                "code": "E",
                "description": "E"
            }, {
                "code": "D",
                "description": "D"
            }, {
                "code": "S",
                "description": "S"
            }]
        });

        Ext.Function.defer(
            (function() {
                var cb = Ext.create('Ext.form.ComboBox', {
                    id: 'acntOvrrideTypeCd-' + rowIndex,
                    queryMode: 'local',
                    renderTo: id,
                    store: store,
                    forceSelection: true,
                    triggerAction: 'all',
                    lazyRender: true,
                    size: 5,
                    valueField: 'code',
                    displayField: 'description',
                    value: val
                    //listeners:{
                    //    scope: this,
                    //    'select': Ext.getCmp('amlFscsForm').controller.amlShow(rowIndex)
                    //}

                });
                cb.on(afterrender, function() {
                    console.log("------- box---" + rowIndex);
                    Ext.getCmp('amlFscsForm').controller.amlShow(rowIndex);
                });
            }), 0.25);

        console.log("i----------" + id);
        return (Ext.String.format('<div id="{0}"></div>', id));
    }
}

'afterrender'イベントは発生しません。レンダリング後にコンポーネントを有効または無効にする必要があります。

誰か助けてもらえますか?

4

2 に答える 2

0

コードにいくつかの問題があります。

  1. グリッドのレンダラー関数でコンボボックスを作成しようとしているようです(上部のコードはコードブロックに含まれていませんでした)。代わりにプラグインを使用することをお勧めします。プラグインを使用Ext.grid.plugin.CellEditingすると、列がレンダリングされるときではなく、オンデマンドでフィールドが作成されます。さらに、グリッドビューが更新されるたびに、グリッド内のすべての行に対して別のストアとコンボボックスが作成されます。パフォーマンスにも、ユーザーエクスペリエンスにも良くありません。

  2. deferを呼び出す場合、継続時間はミリ秒単位であり、秒単位ではありません。また、関数を括弧で囲む必要はありません。関数自体を与えるだけです。このような:

    Ext.defer(function(){
        // do stuff
    }, 25);
    
  3. lazyRenderをtrueに設定すると、コンポーネントが、すべてのコンポーネントをすぐにレンダリングしないコンテナ(タブパネルなど)の子である場合にのみ機能します。

  4. 作成時に利用可能な情報がない場合を除いて、コンボボックスをレンダリングするときではなく、作成するときにコンボボックスで無効な構成を設定する方が簡単な場合があります。

  5. nscrobが言ったように、onメソッドを使用するときは、イベントを文字列として指定する必要があります。(コメントアウトした)リスナー構成を使用する場合は、次のことを実行できます。

    listeners: {
        afterrender: function(){
            console.log("------- box---" + rowIndex);
            Ext.getCmp('amlFscsForm').controller.amlShow(rowIndex);
        },
        select: function(){
            Ext.getCmp('amlFscsForm').controller.amlShow(rowIndex);
        }
    }
    

    scope: thisこれらのリスナー関数のスコープはデフォルトでコンポーネント自体(コンボボックス)に設定されているため、不要であることに注意することが重要です。スコープをこのコンボボックスを作成しているオブジェクトにする必要がない限り、つまり。

最初のポイントが最も重要です。CellEditing(またはRowEditing)プラグインの使用を検討してください。そうすれば、物事がよりスムーズに進むことを保証します。

于 2012-08-22T12:55:09.547 に答える
0

これは単なるタイプミスです。アフターレンダーは引用符で囲む必要があります。そうでない場合は、未定義のイベントの関数を追加するだけです。

cb.on('afterrender',function(){
     console.log("------- box---" + rowIndex);
     Ext.getCmp('amlFscsForm').controller.amlShow(rowIndex);
});
于 2012-08-22T12:34:46.853 に答える