如何ajax只渲染输入而不是整个表单？答案

【问题标题】：How to ajax render only the inputs instead of the whole form?如何ajax只渲染输入而不是整个表单？
【发布时间】：2011-10-18 14:25:16
【问题描述】：

我在 JSF 2.0 中有一个包含大量文本（标签）和复选框的表单。提交时文本永远不会更新，但复选框值会更新。

例如：

<h:form>

  <h:outputLabel value="bla bla bla bla .. X 1000" id="lab1">
  <h:selectBooleanCheckbox for="lab1">

  <h:outputLabel value="bla bla bla bla .. X 1000" id="lab2">
  <h:selectBooleanCheckbox for="lab2">

  .... many more labels and checkboxes ...

  <h:commandButton>
      <f:ajax render="@form" execute="@form" />
  </h:commandButton>     

</h:form>

问题是每当我提交时，整个表单内容都会被重新渲染。我只想重新渲染复选框值。这可以节省 90% 的请求大小。

这个问题有好的解决办法吗？

【问题讨论】：

标签： ajax jsf jsf-2 rerender

【解决方案1】：

render 属性接受由空格分隔的多个组件 ID 字符串。您可以在 render 属性中指定所需输入的组件 ID，而不是整个 @form。

您的视图标记无效（看起来您将标签 for 与输入 id 混淆了），但实际上应该如下所示：

<h:outputLabel value="bla bla bla bla .. X 1000" for="lab1">
<h:selectBooleanCheckbox id="lab1">

<h:outputLabel value="bla bla bla bla .. X 1000" for="lab2">
<h:selectBooleanCheckbox id="lab2">

.... many more labels and checkboxes ...

<h:commandButton>
    <f:ajax execute="@form" render="lab1 lab2 lab3 lab4 ..." />
</h:commandButton>

请注意，它也接受 EL 表达式。如果这是一个动态生成的表单和/或在 bean 中预先知道复选框的 ID 和数量，那么您应该能够使用类似的东西：

    <f:ajax execute="@form" render="#{bean.allCheckboxIds}" />

【讨论】：

谢谢！我确实混淆了属性（仅作为示例编写）。
说，我可以在 render 属性中使用 JAVASCRIPT 表达式吗？（是这样，我自动构建了一个javascript var，其中包含表单中所有复选框和输入的ID）
不，你不能。这完全是在服务器端进行评估的。如果您想将责任与托管 bean 分离并以其他形式重用它，您最多可以为此创建一个自定义 EL 函数。或者也许创建一个自定义 ajax 标记，但这并不是微不足道的。