将 Play Framework 参数传递给 javascript答案

【问题标题】：Pass Play Framework parameter to javascript将 Play Framework 参数传递给 javascript
【发布时间】：2013-05-11 11:27:28
【问题描述】：

我正在尝试将来自控制器的参数传递给 javascript 脚本，以便我可以编辑数据。但是 javascript 不接受我的参数。

代码如下：

@for(status <- lista){
<tr>
<td>@status.getDescricao()</td>
<td><a href="javascript:;" onclick="enviar('formAltStatus/@status.getCodStatus()')"><img src="@routes.Assets.at("img/edit.png")" alt="" title="Editar"/></a>
                    <a href="@routes.StatusController.removerStatus(status.getCodStatus())"><img src="@routes.Assets.at("img/erase.png")" alt="" title="Remover"/></a>
</td>
</tr>
            }

@status.getCodStatus() 是我的 ID。

路线：

GET     /formAltStatus/:id              controllers.StatusController.formAltStatus(id:Long)

javascript：

function enviar(a){
    $.ajax({
        url: "/"+a,
        type: "GET",
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        dataType: "html",
        async:true,
        success: function(html){        
            $("#nova").html("");
            $("#nova").html(html);
            $("#logo").show();
        }
    });
}

还有其他方法吗？

【问题讨论】：

标签： javascript playframework playframework-2.0

【解决方案1】：

HTML5 data attributes 专为这种情况而设计，您必须将服务器端数据传递给客户端函数。我认为最佳实践解决方案是在您的锚标记中添加一个数据属性，然后在 Javascript 中检索该属性值。

<a ... data-status="@status.getCodStatus" data-param2="@param2">

然后，此代码说明了 Javascript 的外观。我没有太多 Javascript 专业知识，所以我编写了一个使用 JQuery 的解决方案。如果您不使用 JQuery 而只是使用纯 Javascript，则必须修改我的建议。

HTML：

<!-- Simple illustration of how to pass server-side data to a JS function -->
<a href="no-javascript.html" class="edit-link" data-status="@status.getCodStatus" data-param2="@param2">
    Hyperlink body goes here
</a>

Javascript：

$('.edit-link').click(function(e) {
   e.preventDefault();
   statusCode = $(this).data('status', 'param2');
   alert(statusCode);
 });

Live example on jsFiddle.

【讨论】：

【解决方案2】：

类似的情况。想要将模板参数设置为角度范围变量。我传递了模型对象的 Json 版本并使用 ng-init 进行设置。

服务器端

return ok(views.html.database.admin.chargeGroups.render(Json.toJson(commodity)));

前端

@(commodity: com.fasterxml.jackson.databind.JsonNode)
@main("Charge Groups") {
<div ng-controller="ChargeGroupsController" ng-init="commodity = @commodity">

【讨论】：