【发布时间】：2015-03-19 05:42:30
【问题描述】：
我正在学习 Backbone js，所以我已经开始创建示例应用程序。
顺便说一句，我现在面临一个问题，即模型在我的数据库中保存了不止一次。我的意思是当你点击 'Create User' 时，你会看到一个表单，所以当我点击 'Create User' 按钮时，详细信息会在我的数据库中多次保存，因此所有重复的用户主页上显示的信息。
其实我正在尝试练习这个视频：https://www.youtube.com/watch?v=FZSjvWtUxYk
输出如下所示：http://backbonetutorials.com/videos/beginner/#/new
这是我的代码：
<html>
<head>
<link rel="stylesheet"
href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css">
<script type="text/javascript">
/*$.getJSON('api/users/1',function(data){
console.log(data);
});*/
</script>
</head>
<body>
<div class="container">
<h1> User Manager</h1>
<hr/>
<div class="page"></div>
</div>
<script type="text/template" id="user-list-template">
<a href="#/new" class="btn btn-primary">New User</a>
<hr/>
<table class="table stripped">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<% _.each(users, function(user){ %>
<tr>
<td><%= user.get('firstName') %></td>
<td><%= user.get('lastName') %></td>
<td><%= user.get('age') %></td>
</tr>
<% }); %>
</tbody>
</table>
</script>
<script type="text/template" id="add-user-template">
<legend>Create User</legend>
<form class="add-user-form">
First Name <input type="text" id="firstName"/><br/>
Last Name <input type="text" id="lastName"/><br/>
Age <input type="text" id="age"/><hr/>
<input type="submit" value="Create User">
</form>
</script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"></script>
<script type="text/javascript">
var UsersList = Backbone.Collection.extend({
url: 'api/users'
});
var User = Backbone.Model.extend({
urlRoot: 'api/users'
});
var UsersListView = Backbone.View.extend({
el: '.page',
render: function(){
var that = this;
var users = new UsersList();
users.fetch({
success: function(usersList){
var template = _.template($('#user-list-template').html())({users: usersList.models});
that.$el.html(template);
}
});
}
});
var AddUserView = Backbone.View.extend({
el: '.page',
render: function(){
var template = _.template($('#add-user-template').html())({user:null});
this.$el.html(template);
},
events: {
'submit .add-user-form': 'saveOrUpdateUser'
},
saveOrUpdateUser: function(e){
e.preventDefault();
var userDetails = {firstName: $('#firstName').val(), lastName: $('#lastName').val(), age: $('#age').val()};
var user = new User();
user.save(userDetails,{ //SEEMS LIKE HERE HAVING SOME PROBLEM
success: function(){
console.log('INSIDE SUCCESS..');
router.navigate('',{trigger: 'true'});
}
});
}
});
var Router = Backbone.Router.extend({
routes:{
'':'home',
'new':'addUser'
}
});
var router = new Router();
router.on('route:home',function(){
var usersListView = new UsersListView();
usersListView.render();
});
router.on('route:addUser',function(){
var addUserView = new AddUserView();
addUserView.render();
});
Backbone.history.start();
</script>
</body>
</html>
请建议我出了什么问题以及如何解决这个问题？
【问题讨论】：
-
我认为问题在于您没有提供
idAttribute，因此当您尝试更新用户时，它没有更新的参考点。所以它会创建另一个 -
@Scriptable 我猜默认情况下它将具有 'id' 属性，据我所知，只有当我们的 id 名称与 'id' 不同时，我们才需要使用 idAttribute ，例如: 'idAttribute : userId'
-
模型中有id字段吗？
-
@Scriptable Iam 认为 'id' 应该是默认值，如果我们不指定它，则在模型中。你真的认为“id”会导致问题吗？
-
Backbone 默认使用 REST http 请求，所以使用 ID 来更新/获取/删除。如果没有指定 id 它不能做这些事情。在控制台窗口中检查您的 ajax 请求，检查您发回服务器的内容。在服务器上检查您收到的内容。如果您无法识别记录，则无法更新它。它会插入
标签： javascript jquery backbone.js