0

私の入力はHTMLファイルですmyボタンはjsファイルにあります。私の初心者は私に教えてください。私はまだバックボーンを混同しています.jsボタンをクリックした後、backbone.jsのテキストフィールドをクリアするにはどうすればよいですか?

var ListView = Backbone.View.extend({ 
    el: $('body'), 
    events: { 
     'click button#add': 'addItem' 

    }, 
    initialize: function() { 
     _.bindAll(this, 'render', 'addItem', 'appendItem'); 

     this.collection = new List(); 
     this.collection.bind('add', this.appendItem); 

     this.counter = 0; 
     this.render(); 
    }, 

    render: function() { 
     $(this.el).append("<button id='add' class='btn btn-primary clear'>Add Items</button>"); 
     $(this.el).append("<ul class='ul_adjust'></ul>"); 
     _(this.collection.model).each(function (item) { 
      appendItem(item); 
     }, this); 
    }, 

    addItem: function() { 

     var item = new Item(); 
     item.set({ 
      part1: $("#name").val() 
     }); 

     this.collection.add(item); 
    }, 
    appendItem: function (item) { 
     var itemView = new ItemView({ 
      model: item 
     }); 

     $('ul', this.el).append(itemView.render().el); 
    }, 


}); 

あなたはそれを手に入れましたか? 私はいくつかを削除する必要はありませんが、私はここにどこかに挿入されると思います。

+0

'$(this.el)'の代わりに 'this。$ el'を使うべきです。また、ビュー内の要素を見つけるには 'this。$(selector)'を使います。バックボーンコレクションには既に 'each'関数があります。直接' this.collection.each(function(){...}、this)} 'と呼ぶことができます。 'bind'や' bindAll'の代わりに 'this.listenTo'を使います。 –

答えて

1

eventsボタンは、#addボタンをクリックすると、addItem機能を呼び出すように設定されています。したがって、同じ機能のテキストボックス#nameをクリアするだけです。

は、私は単純にするだろう:

$("#name").val(""); 

あなたaddItem関数の最後に、あなたが不要になったthis.collection.add(item);はとても価値が唯一クリアされた後。

+0

私はどのラインを挿入すべきですか?イベントが必要ですか? – rose

+0

あなたの 'events'は'#add'ボタンをクリックすると 'addItem'関数を呼び出すように設定されています。したがって、この同じ関数で '#name'というテキストボックスをクリアするだけです。最後に( 'this.collection.add(item);'の後ろに追加してください)、最後に値がクリアされるだけで、必要なときに値はまだ利用可能です。 – Dominic

+1

あなたの答えに追加の詳細を編集してください。また、私は 'this。$( '#name')。val( '')'を代わりに使用します。 –

関連する問題