0

ボタンをクリックしてインライン編集を実行したいのですが、タイトルのテキストフィールドと期間の番号フィールドがアクティブになります。Senchaを初めて使用する場合、どのように実行できますか。

{
            xtype: 'list',
            store: "Plays",
            itemId:"playsList",

            mode: 'MULTI',
            loadingText: "Loading PlaysList...",
            emptyText: '<div class="notes-list-empty-text">No PlayList found.</div>',
            itemTpl: '<div class="list"><div class="list-item-title">{title}</div><div class="list-item-narrative">{duration}</div><div class="list-item-hide">{hidden}</div></div>',      
            grouped: true,


        },
     {
                xtype: "button",
                iconCls: "inlineedit",
                iconMask: true,
                itemId: "inlineediting"
        },

したがって、ボタンをクリックすると、タイトルテキストフィールドと期間番号フィールドのリストで編集機能がアクティブになるか、編集機能が表示されます。

4

1 に答える 1

1

私の推測では、次のようなことをすることになるでしょう：

editingモデルにフィールドを追加します

fields: [
    ... // Other fields
    {name:"editing", type:"boolean", defaultValue: false}, 
]

この種のテンプレートを使用する

itemTpl: new Ext.XTemplate(
    '<tpl if="editing == false">',
        '<input type="text" name="title" value="{title}" disabled/>',
    '<tpl else>',
        '<input type="text" name="title" value="{title}"/>',
    '</tpl>'
)

次に、ボタンをクリックするときは、次の手順に従う必要があります。

  • あなたの店を手に入れよう
  • ストアのすべてのレコードをループします
  • レコードごとに、editing値をtrueに設定します

次に、テンプレートが再レンダリングされ、入力が編集可能になります。

もちろん、CSSを操作して、それが入力であることをユーザーに隠す必要があります。

最後に、編集が完了したら（ある種の「完了」ボタンがあると思います）、リストのすべての項目を調べて、ストアを新しい値で更新する必要があります。

私はそれを試していませんが、過去に同様のことをしました。

お役に立てれば

于 2012-06-29T19:36:25.040 に答える