0

谁能指导我如何在播放框架中使用 ajax 调用 jsp/html 页面？

我想在单击按钮时打开一个灯箱，并希望使用包含数据库数据的页面加载它。目前我刚刚使用 ajax 显示了消息。下面是Application.java中的方法

public static Result index()
  {
    return ok(index.render("Your new application is ready."));
  }

我的 index.scala.html 是：

@(products: List[Products])

@import helper._
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<h1>@products.size() product(s)</h1>
<table border=1>
<tr>
<td>Product Name</td>
<td>Quantity</td>
<td>Price</td>
</tr>
@for(product <- products) {
    <tr>
        <td>
            @product.productname
        </td>
        <td>
            @product.quantity
        </td>
        <td>        
            @product.price
        </td>
        <td id="items">        

            <a href="@routes.Application.user(product.product_id)"><input type="button" value="Add Product" name="@routes.Application.user(product.product_id)" id="but"/></a>

        </td>
    </tr>
}
</table>


<div class="result1" style="border: 1px solid black; padding: 5px;">not sent yet...</div>


<script type="text/javascript">
    jQuery("#items a").click(
            function () {
                $.get(jQuery(this).attr("href"), function (data) {
                    $('.result').html(data);
                });
                return false;
            }
    )
</script>
4

1 回答 1

2

你走在好的路上。

创建一个新操作，它将仅返回您在 div 中需要的 html（而不是完整的 html 页面）。

public static Result detail(Integer productId)
{
    Product product = .... (productId);
    return ok(productDetail.render(product));
}
// with the route of course

productDetail.scala.html

@(product: Product)

My product @product.product_id is beautiful !
....

您还必须添加一个jquery 插件来显示您的灯箱（有一千个......）

您的 JsCode 将是这样的：

$("#items a").click(function () {
   $("#result").load($(this).attr("href"), function() {
      displayPopup(); // code this
   });
});

（或者如果插件本机处理ajax，则可能是完全不同的代码......）

在简历中，有很多工作要做，有很多方法可以做到。你试一试 ！

于 2013-01-07T15:57:23.887 回答