1

オプションタグを選択リストに動的に入れようとしています。

ADDボタンを押すと、入力テキストの値が新しいモデルのフィールドとして設定され、このモデルが (.create メソッドによって) コレクションにプッシュされ、イベントが発生して選択ビューが更新されます。問題は、新しく作成されたモデルの ID プロパティをDOMに配置する必要があることです(モデル インスタンスは Collection.create によって返されますが、発生したイベントは「不完全な」モデルを渡します)。

//オプションビュー

optionView = Backbone.View.extend({

tagName: 'option',

attributes: function(){
    var f1 = this.model.get("f1");
    var id = this.model.get("id");
    return {
        value: f1,
        id: id
    };
},

render: function(){
    this.$el.text(this.model.get("f1"));
    return this; 
}

});

//ビューを選択

selectView = Backbone.View.extend({

el: '#container',

collection: selectList,

events: {
    "click #add-season":  "create",
},

initialize: function () {
  var options = this.collection;

    this.$addInput = this.$('#new-opt');  

_.bindAll(this, 'appendOne', 'appendAll');

    options.on('add',     this.appendOne); 
    options.on('reset',   this.appendAll);

    options.fetch(); // Loads list from local storage
},

appendOne: function(opt) { //PROBLEM! opt doesn't have auto-generated ID yet

var view = new app.OptionView({model: opt});

    this.$("#select-list").append( view.render().el );
},

appendAll: function() {
this.$("#select-list").html('');
    this.collection.each(this.appendOne);
},


create: function() { 

    this.collection.create({
        f1: this.$addInput.val() 
    });

    this.$addInput.val('');
}

});
4

1 に答える 1

1

{wait: true}新しいモデルをコレクションに追加する前にサーバーを待ちたい場合は パスします。作成

これを試して

create: function() { 

    this.collection.create({
        f1: this.$addInput.val() 
    }, {wait : true});

    this.$addInput.val('');
}
于 2013-03-15T09:17:32.923 に答える