2

XTemplateがあり、テンプレート内に実際のEXTウィジェットをいくつか追加して、ウィジェットの上下にテンプレートコードをレンダリングしたいと思います。次のitemTplが定義された「dataview」があるとします。

    itemTpl: [
        '<tpl for=".">',
        '<div class="song-page-header">',
        '   <div class="artwork"><img src="{artwork}"/></div>',
        '   <h1>{title}</h1>',
        '   <h2>{artist}</h2>',
        '   <h3>Genre: {genre}</h3>',
        '   <p>{copyright}</p>',
        '</div>',

        /* Ext.Button should go here */

        '<tpl for="offers">',
        '   <p>{offer_id}: {offer_type}, {price}</p>',
        '</tpl>',
        '</tpl>'
    ]

そこに実際のExt.Buttonを定義することは可能ですか(Ext.Buttonの動作を近似するHTMLだけではありません)?事後に適用する必要があるかどうかは気にしませんが、そこにボタンを挿入できるようにするために使用する正しいイベントハンドラーが見つからないようです。Senchaのドキュメントはひどいので、どんな助けでも大歓迎です。

4

2 に答える 2

2

実際にはこれを行うことができます。少し創造的である必要があります。

ここで私のブログ投稿をチェックしてください: http://jakes-hackerblog.herokuapp.com/blog/2013/05/23/a-fresh-rails-blog/

基本的に、テンプレートに動的な div 要素を配置します

                '<div id="box-holder">' +
                    '<div id="box-{schoolpersonid}"></div>'+
                '</div>'+

次に、ボタン構成内で use "renderTo" を使用し、更新関数で呼び出します。

    listeners: {

        'refresh': function(records) {

            var storeRecords = records._store._data.items;

            for(var i = 0; i < storeRecords.length; i++){

                var data = storeRecords[i].data;
                var renderTo = this.element.select('#box-' + data.schoolpersonid).elements[0];

                var button1 = new Ext.Button({
                    action:             'doPresent',
                    xtype:              'button',
                    align:              'right',
                    text:               'Present',
                    ui:                 'present',
                    renderTo:            renderTo,
                    schoolpersonid:      data.schoolpersonid
                });
            }
        }
    },
于 2013-07-19T23:14:07.227 に答える
0

Sencha Touch フレームワークの管理とパフォーマンスのために、XTemplate はこの機能をサポートしていないと思います。

itemTpl第二に、基本的に、sencha テンプレートが html 構造のみを許可する場合にHTML と JavaScript をマージしようとしているため、そのようにすることはできません。

このシナリオに対処するには、Component Dataviewを参照してください。

于 2013-03-05T18:29:13.453 に答える