1

テンプレートをレンダリングするビューがあります。テンプレートは、jquery プラグインを使用してインラインで編集できる多くの要素で構成されています。要素は、それに応じて各 div への .editable() 呼び出しで編集可能になります。

次のような要素を含むテンプレートがあります。

<div id="pricing">some value</div>
<div id="terms">some other value</div>

ビューが再レンダリングされるたびに、私の要素は .editable() 機能を失います。プラグインは独自のクラス名などを適用します。

私のビューのレンダリングでは、次のようにしてこれを機能させることができます。

var MyView = new Backbone.View.extend({ 

    render: function() { 
        var html = this.template(this.model.toJSON());
        this.$el.html(html);
        this.$el.find('#pricing').editable();
        this.$el.find('#terms').editable();    
});

ビューの render メソッドで必要なすべての div に .editable() を明示的に宣言せずにこれを行うより良い方法はありますか?

4

1 に答える 1

2

それを回避する方法はあまりないと思います。editable()プラグインを使用して dom 要素を操作する準備が整った後で、 への呼び出しを行う必要があります。HTML を置き換えているため、ビューが再レンダリングされるまで待つ必要があります。のような独自のクラスを編集可能にする必要がある div を指定することをお勧めしますeditable。次に、divごとに個別に行う代わりに、クラスセレクターを使用できます。

<div id="pricing" class="editable">some value</div>
<div id="terms"  class="editable">some other value</div>

次に、次のことができます。

this.$(".editable").editable(); //or this.$el.find('.editable').editable();
//instead of 
this.$el.find('#pricing').editable();
this.$el.find('#terms').editable();  
//etc.

これにより、すべての div に対して新しい呼び出しを作成する必要がなくなり、ビューから div を追加/削除するときに常に更新する必要がなくなります。

于 2012-12-20T19:45:58.270 に答える