如何通过 AJAX 请求更新挂毯中的 <input/> 字段

Question

我有一个使用 Tapestry 5 开发的项目。 我需要使用 AJAX 请求更新输入字段（在表单内）。

Page.tml 是这样的：

<form>
    <t:zone t:id="myZone">
        <input type="text" t:type="TextField" t:value="product.code"/>
    </t:zone>
    <t:actionlink t:id="generateCode" zone="myZone">Generate</t:actionlink>
</form>

还有Page.java

Object onActionFromGenerateCode() {
    return myZone.body();
}

点击“生成”链接时，tapestry 抛出异常。不要让我更新表单内的区域：

java.lang.RuntimeException
The component must be enclosed by a Form component.

如何更新此输入字段？

谢谢

Answer 1

由于FormSupport 实例必须在服务器端事件中的Environment 上可用，因此通过 ajax 更改表单部分变得很棘手。

这可能更容易：

1. 将整个表单放在一个区域中并刷新整个表单
2. 从服务器端事件执行一些 javascript

选项 2 的工作原理如下：

TML

<form>
    <input id="productCode" type="text" t:type="TextField" t:value="product.code" />
    <!-- note that async is a recent addition to eventlink in tapestry 5.4 -->
    <!-- Use a dummy zone for previous versions -->
    <t:eventlink event="generateCode" async="true">Generate</t:eventlink>
</form>

Java

@Inject JavaScriptSupport jss

void onGenerateCode() {
    String productCode = generateProductCode();
    jss.addScript("$('#productCode').val('%s');", productCode); // assuming jquery
}

注意，可以通过 ajax 动态更改表单，正如我所说的，这很棘手。示例包括 AjaxFormLoop 和 FormInjector