Backbone JS：與點擊事件和POST請求相關的問題

Question

我是Backbone的新手，剛剛完成了一個簡單的get請求。
試圖實現一個簡單的POST請求。用戶點擊Transfer按鈕輸入字段值將作爲JSON對象發送到REST API。

<div id="transfer"> <input type="text" placeholder="From Address" id="fromAddress" /> <input type="text" placeholder="To Address" id="toAddress" /> <input type="text" placeholder="Amount" id="dollars" /> <input type="button" id="button" value="Transfer"/> </div>

1期
第一個問題是什麼將進入Backbone View。
我的骨幹查看：

var TransferView = Backbone.View.extend({ 

    events: { 
     "click #button": "sendMoney" 
    }, 
    sendMoney: function() { 
     alert(); 
     console.log($("#fromAddress").val()); 
      //this.model.transferMoney($("#fromAddress").val(), 
       $("#toAddress").val(), $("#dollars").val()); 
    } 
}); 

var transferView = new TransferView(); 
transferView.render(); 

當我點擊按鈕，沒有任何反應。這裏有什麼問題？

第2期 骨幹模型看起來像這樣。

var Money = Backbone.Model.extend({ 
    url: 'http://localhost:3000/sendMoney', 
    defaults: { 
     fromAddress: "", 
     toAddress: "", 
     amount: "" 
    }, 
    transferMoney: function(request, response) { 
     //get field values? 
     this.save(); 
    } 
}); 

var transferMoney = new Money(); 

流量沒有達到該模型還沒有，但我不知道我怎麼會取fromAddress, toAddress and amount值從req？
如何將JSON格式的請求參數傳遞給REST服務？

注意：在這裏不能使用form。它更像是一個Ajax請求。

Answer 1

你的看法的問題是：

• 你缺少一個template
• 你有$("#toAddress").val(), $("#dollars").val());

一個語法錯誤，因爲視圖沒有模板，什麼都不顯示，因此沒有「#button」來附加事件。另外，不要忘記，您通常需要爲視圖提供一個Money模型實例，以便您可以在其上設置屬性。

要從表單中傳遞值，只需使用val()方法。

併發送數據到API，你只需要save：骨幹完成剩下的工作。

基本上，你可能想有什麼是一樣的東西

var TransferView = Backbone.View.extend({ 

    events: { 
     "click #button": "sendMoney" 
    }, 
    sendMoney: function() { 
     this.model.save({ 
      fromAddress: $("#fromAddress").val(), 
      toAddress: $("#toAddress").val(), 
      amount: $("#dollars").val(), 
     }); 
    } 
}); 

並以實例化視圖：

var money = new Money(); 
var transferView = new TransferView({ model: money }); 

它很可能是你的時間了良好的投資看了幾個骨幹教程，如http://coenraets.org/blog/2011/12/backbone-js-wine-cellar-tutorial-part-1-getting-started/

要委託保存模型方法，請執行如下操作：

var Money = Backbone.Model.extend({ 
    url: 'http://localhost:3000/sendMoney', 
    defaults: { 
     fromAddress: "", 
     toAddress: "", 
     amount: "" 
    }, 
    transferMoney: function(attributes) { 
     this.save(attributes); 
    } 
}); 

var TransferView = Backbone.View.extend({ 

    events: { 
     "click #button": "sendMoney" 
    }, 
    sendMoney: function() { 
     this.model.transferMoney({ 
      fromAddress: $("#fromAddress").val(), 
      toAddress: $("#toAddress").val(), 
      amount: $("#dollars").val(), 
     }); 
    } 
});