成功属性无法在视图中触发
success attribute unable to fire in View
最近在学习Backbone JS,下面是'EditUser中无法触发'success'的代码'
请告诉我我需要做哪些改变?
以下代码为组合代码:
<script type="text/template" id="edit-user-template">
<form class="edit-user-form" method="POST">
<legend>Create New User</legend>
<label>First Name</label>
<input type="text" name="firstname" id="firstname"/>
<label>Last Name</label>
<input type="text" name="lastname" id="lastname" />
<label>Age</label>
<input type="text" name="age" id="age" />
<hr/>
<input type="submit" value="Create User" />
</form>
</script>
var User = Backbone.Model.extend({
urlRoot: 'api/users'
})
var EditUser = Backbone.View.extend({
el: '.page',
events:{
'submit .edit-user-form':'saveUser'
},
saveUser : function(e){
var user = new User();
user.save({firstName: $('#firstname').val() ,lastName: $('#lastname').val() ,age: $('#age').val() },
{
success : function(user){
console.log('INSIDE SUCCESS..')
router.navigate('',{trigger:'true'});
}
});
},
render: function(){
var template = _.template($('#edit-user-template').html());
this.$el.html(template);
}
})
@POST
@Consumes({ MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML})
@Produces({ MediaType.APPLICATION_JSON })
public User create(User user) {
return dao.create(user);
}
public User create(User user) {
Connection c = null;
PreparedStatement ps = null;
try {
c = ConnectionHelper.getConnection();
ps = c.prepareStatement("INSERT INTO user (firstname, lastname, age) VALUES (?, ?, ?)",
new String[] { "ID" });
ps.setString(1, user.getFirstName());
ps.setString(2, user.getLastName());
ps.setInt(3, user.getAge());
ps.executeUpdate();
ResultSet rs = ps.getGeneratedKeys();
rs.next();
// Update the id in the returned object. This is important as this value must be returned to the client.
int id = rs.getInt(1);
user.setId(id);
} catch (Exception e) {
e.printStackTrace();
throw new RuntimeException(e);
} finally {
ConnectionHelper.close(c);
}
return user;
}
我已经在谷歌中搜索过,但仍然无法采纳他们的建议。希望有人能解决我这个问题
更新:
public class User {
private int id;
private String firstName;
private String lastName;
private int age;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
EditUser 视图中的 saveUser 方法没有覆盖提交事件的默认行为。
试试这个:
saveUser : function(e){
// This will prevent the form from submitting normally.
e.preventDefault();
var user = new User();
user.save(
{
firstName: $('#firstname').val()
,lastName: $('#lastname').val()
,age: $('#age').val()
},
{
success : function(user){
console.log('INSIDE SUCCESS..')
router.navigate('',{trigger:'true'});
}
}
);
}
最近在学习Backbone JS,下面是'EditUser中无法触发'success'的代码'
请告诉我我需要做哪些改变?
以下代码为组合代码:
<script type="text/template" id="edit-user-template">
<form class="edit-user-form" method="POST">
<legend>Create New User</legend>
<label>First Name</label>
<input type="text" name="firstname" id="firstname"/>
<label>Last Name</label>
<input type="text" name="lastname" id="lastname" />
<label>Age</label>
<input type="text" name="age" id="age" />
<hr/>
<input type="submit" value="Create User" />
</form>
</script>
var User = Backbone.Model.extend({
urlRoot: 'api/users'
})
var EditUser = Backbone.View.extend({
el: '.page',
events:{
'submit .edit-user-form':'saveUser'
},
saveUser : function(e){
var user = new User();
user.save({firstName: $('#firstname').val() ,lastName: $('#lastname').val() ,age: $('#age').val() },
{
success : function(user){
console.log('INSIDE SUCCESS..')
router.navigate('',{trigger:'true'});
}
});
},
render: function(){
var template = _.template($('#edit-user-template').html());
this.$el.html(template);
}
})
@POST
@Consumes({ MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML})
@Produces({ MediaType.APPLICATION_JSON })
public User create(User user) {
return dao.create(user);
}
public User create(User user) {
Connection c = null;
PreparedStatement ps = null;
try {
c = ConnectionHelper.getConnection();
ps = c.prepareStatement("INSERT INTO user (firstname, lastname, age) VALUES (?, ?, ?)",
new String[] { "ID" });
ps.setString(1, user.getFirstName());
ps.setString(2, user.getLastName());
ps.setInt(3, user.getAge());
ps.executeUpdate();
ResultSet rs = ps.getGeneratedKeys();
rs.next();
// Update the id in the returned object. This is important as this value must be returned to the client.
int id = rs.getInt(1);
user.setId(id);
} catch (Exception e) {
e.printStackTrace();
throw new RuntimeException(e);
} finally {
ConnectionHelper.close(c);
}
return user;
}
我已经在谷歌中搜索过,但仍然无法采纳他们的建议。希望有人能解决我这个问题
更新:
public class User {
private int id;
private String firstName;
private String lastName;
private int age;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
EditUser 视图中的 saveUser 方法没有覆盖提交事件的默认行为。
试试这个:
saveUser : function(e){
// This will prevent the form from submitting normally.
e.preventDefault();
var user = new User();
user.save(
{
firstName: $('#firstname').val()
,lastName: $('#lastname').val()
,age: $('#age').val()
},
{
success : function(user){
console.log('INSIDE SUCCESS..')
router.navigate('',{trigger:'true'});
}
}
);
}