播放2.x：如何使用通用button进行AJAX请求
所以我已经成功地获得了Ajax请求，但是我一直使用一个表单，然后在提交结束时返回false，以便它不刷新页面。
我也刚刚把我的JavaScript到一个单独的文件，这已经导致我的@命令失败。 正因为如此，我不知道如何设置我的url到我的路线？
HTML：
<button id="saveAsDefaultButton">Save as default</button> 玩框架java代码：
public static Result saveDefaultPhoneForUser(String handset) { User currentUser = User.findByName(session("name")); currentUser.lastControlledHandset = theHandset; currentUser.save(); return ok(); }
路线：
POST / controllers.Application.saveDefaultPhoneForUser(handset : String)
JavaScript的：
$('#saveAsDefaultButton').click(function(evt) { $('#errors').hide(); $.ajax({ type : 'POST', url : "controllers.Application.saveDefaultPhoneForUser", data : $('#controlledPhone option:selected').text(), dataType : "text", success : function(data) { //setError('Call succedded'); //$('#test1').attr("src", data) }, error : function(data) { setError('Make call failed'); } }); return false; });
我确定有办法做到这一点，我只是没有find任何运气。 任何帮助极大appreaciated。
对于这个工作，你应该使用javascriptRoutes因为它会根据你的routes.conf生成正确的JSpath。 您将在Zentask 示例中find使用示例
无论如何，现在你可以修改你的AJAX调用通过更改url
url : '@routes.Application.saveDefaultPhoneForUser()',
这种方式需要把整个JS放在模板中，这是错误的。 它可以甚至应该被移动到单独的JS文件，并使其成为可能，你需要使用javascriptRoutes。
更多…
javascriptRoutes在官方文档中没有描述，但是这里是一步一步的介绍。 尽pipe使用这种方式事实上的描述看起来很复杂，但带来了很多好处。
1.创build通用路线
首先，您需要在conf/routes文件中创build通用路由：
GET /item/:id controllers.Application.getItem(id: Long) POST /item/new controllers.Application.newItem PUT /item/:id controllers.Application.updateItem(id: Long)
当然，你需要在Application控制器中至less创build这三个动作：
-
getItem(Long id){ ... } -
newItem() { ... } -
updateItem(Long id) { ... }
2.创build一个将常用路由转换为JS的操作
- 把它放在某个地方，即。 在
Application控制器中 - 我们称之为
javascriptRoutes()
在这个动作中，你可以从conf/routes文件中指出现有的路由
public static Result javascriptRoutes() { response().setContentType("text/javascript"); return ok( Routes.javascriptRouter("myJsRoutes", routes.javascript.Application.getItem(), routes.javascript.Application.newItem(), routes.javascript.Application.updateItem(), //inside somepackage controllers.somepackage.routes.javascript.Application.updateItem() ) ); }
注意：不要在括号中设置任何参数。
3.为javascriptRoutes操作创build一个路由，并将其包含在您的模板中
路由conf/routes
GET /javascriptRoutes controllers.Application.javascriptRoutes
在/views/main.scala.html <head>部分/views/main.scala.html
<script type="text/javascript" src='@routes.Application.javascriptRoutes()'></script>
4.在需要的地方使用javascriptRoutes
从现在起，您可以使用JS中的路由来获取正确的path，而无需指定url和type 。 举一个例子来代替：
$('.getAjaxForThisContainer').click(function(e) { var idToGet = $("#someField").val(); $.ajax({ type : 'GET', url : '@routes.Application.getItem()', data : { id: idToGet }, success : function(data) { // ... some code on success } }); return false; });
你可以使用简化版本（ myJsRoutes从点2）：
myJsRoutes.controllers.Application.getItem(idToGet).ajax({ success : function(data) { ... some code ... } });
要么
myJsRoutes.controllers.Application.newItem().ajax({ success : function(data) { ... some code ... } });
等等…
- 你不需要指定
type: "POST"– JS路由器将根据conf/routes规则使用正确的方法 - 你可以使用
routes-like纯JS的routes-like语法来将logging（或其他参数）的id设置为GET或PUT（或其他方法） - 如果你的路由规则包含所有必要的参数，你真的可以最小化你的JS：
路线：
GET /some/:a/:b/:c controllers.Application.getABC(a: String, b: Integer, c: String)
JS：
myJsRoutes.controllers.Application.getABC("a", 1, "b" ).ajax({});
在打电话时要注意…
Routes.javascriptRouter("myJsRoutes",
路线是从play.Routes导入的，而不是play.api.Routes
当我实现这个代码的时候有一个错误，因为我认为它会来自api（显然我错了）。 除此之外，一切都很好〜！
我喜欢“老好”的简单方法：
1在页面中，使用JQuery，
里面有一些偶数处理程序
$.get('/giveme', {'arg': value}, function(data) { window.alert(data); } );
2在服务器/播放端
2.1路由： GET /giveme controllers.Application.giveme(arg)
2.2 scala动作：
object Application extends Controller { def giveme(arg:String) = Action { Ok(Json.toJson("hello," + arg )) } }
有一个更简单的解决scheme，使用embedded式路由器来生成Javascript路由器。 您可以使用@javascriptRouter helper指令生成Javascript路由器，将下面的代码放在您的html页头标签（也许在主要的装饰模板中）
<head> <title>Saeed Title</title> <link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.png")"> <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")"> <script src="@routes.Assets.at("javascripts/jquery/v1.12.4/jquery.min.js")" type="text/javascript"></script> @helper.javascriptRouter("jsRoutes")( routes.javascript.MyController.getById, routes.javascript.MyController.getByName ) </head>
不要担心语法错误（在Intellij中），并且不要在操作名称之后使用括号。 现在你可以在你的ajax调用代码中使用jsRoutes.controllers.MyController.getById(id) 。
$.ajax(jsRoutes.controllers.MyController.getById(id)) .done( /*...*/ ) .fail( /*...*/ );
或使用jsRoutes.controllers.MyController.getById(id).url来获取url。 更多信息 。
马库斯的回答非常好，所以有这个问题的其他人应该可以使用这个。
我曾经有过一个问题，但试图让这个工作，这花了我一点时间才能工作。 当我正在做我的ajax请求时，它是路由到错误的方法。
这是因为在我的路线文件中，我有以下几点：
POST / controllers.Application.makeCall() POST / controllers.Application.saveDefaultPhoneForUser(handset : String)
通过具有相同位置/的两个post方法。 它似乎总是去打电话。 所以只是给任何人的提示不这样做否则不会工作。
我只需要将其更改为：
POST / controllers.Application.makeCall() POST /saveDefaultPhoneForUser controllers.Application.saveDefaultPhoneForUser(handset : String)
希望这有助于某人。
