如何使用javascript(即jquery.ajax)使用Play Framework 2验证表单,并将呈现的响应传递给视图?
我正在使用play framework 2.1.3,对使用jquery和ajax进行表单验证有一个疑问。我遵循了本文()中关于设置JavaScript路由的建议,这一部分工作得非常好!我需要第二部分的帮助,返回一个包含错误消息的呈现表单并将其显示在我的页面上。我创建了以下示例来说明我的问题 路由文件如下所示:如何使用javascript(即jquery.ajax)使用Play Framework 2验证表单,并将呈现的响应传递给视图?,java,jquery,ajax,playframework,Java,Jquery,Ajax,Playframework,我正在使用play framework 2.1.3,对使用jquery和ajax进行表单验证有一个疑问。我遵循了本文()中关于设置JavaScript路由的建议,这一部分工作得非常好!我需要第二部分的帮助,返回一个包含错误消息的呈现表单并将其显示在我的页面上。我创建了以下示例来说明我的问题 路由文件如下所示: # AJAX calls POST /validateForm controllers.Application.validateForm() # Jav
# AJAX calls
POST /validateForm controllers.Application.validateForm()
# JavaScript Routing
GET /assets/javascripts/routes controllers.Application.javascriptRoutes()
private static Form<User> form = Form.form(User.class);
public static Result validateForm() {
Form<User> boundForm = form.bindFromRequest();
if (boundForm.hasErrors()) {
return badRequest(user_form.render(boundForm));
} else {
return ok();
}
}
public static Result javascriptRoutes() {
response().setContentType("text/javascript");
return ok(Routes.javascriptRouter("jsRoutes", controllers.routes.javascript.Application.validateForm()
));
}
应用程序控制器如下所示:
# AJAX calls
POST /validateForm controllers.Application.validateForm()
# JavaScript Routing
GET /assets/javascripts/routes controllers.Application.javascriptRoutes()
private static Form<User> form = Form.form(User.class);
public static Result validateForm() {
Form<User> boundForm = form.bindFromRequest();
if (boundForm.hasErrors()) {
return badRequest(user_form.render(boundForm));
} else {
return ok();
}
}
public static Result javascriptRoutes() {
response().setContentType("text/javascript");
return ok(Routes.javascriptRouter("jsRoutes", controllers.routes.javascript.Application.validateForm()
));
}
在不详细讨论视图的情况下,我正确地将JavaScript文件包含在视图中,并且有一个名为#createUserForm的元素
客户端和服务器端之间的通信似乎工作得很好,但是,我无法通过.html(response)将响应中包含的呈现视图元素加载到页面上。那么,如何做到这一点呢?我哪里出错了?我对这些概念中的许多概念都比较陌生,如果有任何有用的意见,我将不胜感激。谢谢
更新:
两个更改将允许此代码完美地工作。(1) 因为我们要替换整个表单,包括按钮,所以需要使用jQuerys.on()来处理按钮单击事件。(2) 调用responseText属性将正确返回结果中包含的html
$(document).on("click", "#createUserBtn", function() {
jsRoutes.controllers.Application.validateForm().ajax({
type: "POST",
data: $("#createUserForm").serialize(),
success: function(response) {
// something here
},
error: function(response) {
$("#createUserForm").html(response.responseText);
}
});
});
有什么评论吗?你怎么能做得更好