2

私はバックボーンの初心者で、Todo のようなアプリを開発しようとしています。

リストビューであるメインビューがあり、サブビューがあります。- サブビューのコンテンツはダブルクリックで編集でき、Enter キーを押すと保存されます。- バックボーンの github コードで与えられた todo の例に非常に似ています。

var SubView = Backbone.View.extend({
    tagName: "li",    
    events: {
        "dblclick"              : "show_edit_view",
        "blur .element"         : "close_edit_view",
        "keypress .element"     : "save_edit_view",
        "click button.remove"   : "remove_question"
    },
    initialize: function(){
        this.render();             
        this.listenTo(this.model, "change", this.render);
    },
    render: function(){        
        this.$el.html(_.template($("#sub_view_template").html(),this.model.toJSON()));
        return this;
    },
    show_edit_view: function() {
        this.$el.find("div.view").addClass("no_show");
        this.$el.find("input").removeClass("no_show");
    },
    close_edit_view: function(){
        this.$el.find("div.view").removeClass("no_show");
        this.$el.find("input").addClass("no_show");
    },
    save_edit_view: function(e){
        if (e.keyCode == 13) {            
            this.model.save({name: e.currentTarget.value});
            this.close_edit_view();
        }
    }
}); 

そして、これのテンプレートは

<script id="sub_view_template" type="text/x-template">
   <div class="view"><%= name %></div>
   <input class="element no_show" value="<%= name %>" type="text" /> <button class="remove">Remove</button>
</script>  

これは正常に機能し、ビューでモデルが更新され、更新投稿リクエストがサーバーに送信されます。

しかし、初期化関数と save_edit_view 関数を変更すると、最初の変更イベントのみが発生し、変更イベントは発生しません。

initialize: function(){
    this.render();             
    this.listenTo(this.model, "change", this.render);
    this.input = this.$("input.element");
},
save_edit_view: function(e){
    if (e.keyCode == 13) {            
        this.model.save({name: $(this.input).val()});
        this.close_edit_view();
    }
}

何が問題なのだろうか?

助けてくれてありがとう!!!

4

2 に答える 2