5 javascript views input models backbone.js
我正在使用Backbone和Laravel创建一个简单的应用程序来管理预订,我正在开发一个简单的表单来更新当前登录用户的用户数据.
我想知道,使用表单中的输入数据更新模型是否有比我更好,更有效的方法?
我在模型中创建了一个名为update的方法,该方法传递了表单的DOM对象.我认为这不是最好的方法.
任何帮助将非常感谢!
var Account = Backbone.Model.extend({
url: "/settings/account",
initialize: function()
{
},
update: function(form)
{
this.set({
first_name : form.find('#first-name').val(),
last_name : form.find('#last-name').val(),
email : form.find('#email').val(),
landline: form.find('#landline').val(),
mobile: form.find('#mobile').val()
});
return this.save();
}
});
var user = new Account;
var AccountView = Backbone.View.extend({
el: $("div.section"),
template: _.template($("#account-template").html()),
events: {
"submit #account": "update"
},
initialize: function()
{
_.bindAll(this, 'render', 'update');
this.render();
},
render: function()
{
$(this.el).html(this.template(this.model.toJSON()));
},
update: function()
{
var form = $(this.el).find('form#account');
user.update(form);
$(this.el).find('.alert-success').show();
return false;
}
});
var Router = Backbone.Router.extend({
routes: {
"account": "account"
},
account: function()
{
user.fetch({
success: function()
{
return new AccountView({model:user});
}
});
}
});
Run Code Online (Sandbox Code Playgroud)
当模型知道其视图时,它被认为是糟糕的设计.我会更新由视图编排的模型.
我认为最简单的方法是在视图中执行此操作:
update: function()
{
var form = $(this.el).find('form#account');
user.set({
first_name : form.find('#first-name').val(),
last_name : form.find('#last-name').val(),
email : form.find('#email').val(),
landline: form.find('#landline').val(),
mobile: form.find('#mobile').val()
});
user.save();
$(this.el).find('.alert-success').show();
return false;
}
Run Code Online (Sandbox Code Playgroud)
否则,模型必须知道在哪里检索值.此外,当您有一天使用不同的视图时,您还必须更改模型类.