Ajax 渲染在 SelectBooleanCheckbox 上不起作用答案

【问题标题】：Ajax render not working on SelectBooleanCheckboxAjax 渲染在 SelectBooleanCheckbox 上不起作用
【发布时间】：2014-08-28 14:27:10
【问题描述】：

我有一个 JSF 表单，上面有一个 selectBooleanCheckbox。如果复选框的值为真，我想在它旁边显示组合框。但不知何故，它不起作用。

这是我的代码：

      <h:outputText value="Condition"/>
      <h:selectBooleanCheckbox id="provisioningTargetCollector" 
                           value="#{targetSource.provisioningTargetCollector}"
                           disabled="#{!sp:hasRight(facesContext, 'ManageApplication')}"
                           readonly="#{!sp:hasRight(facesContext, 'ManageApplication')}">
                           <f:ajax  render="targetCollectorsGroup" />
                           </h:selectBooleanCheckbox>

      <h:outputText value="Provisioning Target Collector"/>
      <h:panelGroup id="targetCollectorsGroup">
        <a4j:outputPanel id="targetCollectors">
          <h:selectOneMenu id="collector"
                           value="#{targetSource.selectedTargetCollector}"
                           rendered="#{empty targetSource.object.id}"
                           disabled="#{!sp:hasRight(facesContext, 'ManageApplication')}"
                           readonly="#{!sp:hasRight(facesContext, 'ManageApplication')}">
            <f:selectItem itemValue="" itemLabel="#{msgs.select_provisioning_target_collector}"/>
            <f:selectItems value="#{targetSource.targetCollectors}"/>
          </h:selectOneMenu>
          <h:selectOneMenu id="fixedTargetCollector" value="#{empty targetSource.selectedTargetCollector ? 'None' : targetSource.selectedTargetCollector}"
                           rendered="#{not empty targetSource.object.id}"
                           disabled="true"
                           readonly="true">
            <f:selectItem itemValue="#{empty targetSource.selectedTargetCollector ? 'None' : targetSource.selectedTargetCollector}"
                          itemLabel="#{empty targetSource.selectedTargetCollector ? msgs.none : targetSource.selectedTargetCollector}"/>
          </h:selectOneMenu>
        </a4j:outputPanel>
      </h:panelGroup>

Bean 类方法：

private boolean _provisioningTargetCollector;

public boolean isProvisioningTargetCollector() {

    return _provisioningTargetCollector;
 }

 public void setProvisioningTargetCollector(boolean provisioningTargetCollector) {

     _provisioningTargetCollector = provisioningTargetCollector;
 }

注意：复制自 FireBug

这是 POST 请求：

AJAX:EVENTS_COUNT   1
editForm    editForm
editForm:collector  
editForm:collectorType  
editForm:dsCorrelationRul...    
editForm:dsCreationRule 
editForm:dsDescription  
editForm:dsName 
editForm:id 2c90950048166abc0148177755040025
editForm:selectedTargetsF...    
editForm:type   Active Directory - Direct
javax.faces.ViewState   1920301575480395177:8510885827764100150
javax.faces.behavior.even...    click
javax.faces.partial.ajax    true
javax.faces.partial.event   click
javax.faces.partial.execu...    editForm:provisioningTargetCollector editForm:provisioningTargetCollector
javax.faces.partial.rende...    editForm:targetCollectorsGroup
javax.faces.source  editForm:provisioningTargetCollector
rfExt   null

回复：

<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="editForm:targetCollectorsGroup"><![CDATA[<span id="editForm:targetCollectorsGroup"><span id="editForm:targetCollectors"><select id="editForm:collector" name="editForm:collector" size="1">  <option value="">Select a Provisioning Target Collector ...</option>
    <option value="AD Test">AD Test</option>
    <option value="ADWindow">ADWindow</option>
    <option value="ADTestSth">ADTestSth</option>
</select></span></span>]]></update><update id="javax.faces.ViewState"><![CDATA[1920301575480395177:8510885827764100150]]></update><extension id="org.richfaces.extension"><render>editForm:targetCollectorsGroup</render></extension></changes></partial-response>

【问题讨论】：

把execute="@this"加到f:ajax后可以试试吗？
@tt_emrah 我试过了。还是不行。
尝试将<f:ajax render="targetCollectorsGroup" /> 替换为<a4j:ajax event="click" render="targetCollectorsGroup" />。不相关：你真的需要<h:panelGroup id="targetCollectorsGroup">吗？出于渲染目的，您可以使用targetCollectors。
@VasilLukach 更改为 a4j 后仍然无法正常工作。是的，我也可以。
您的代码有噪音。考虑删除所有不相关的标签/属性/样式/等。从您的角度来看，这不会影响所讨论的问题。乍一看，我会说您的代码和描述不一致：您希望依赖通过复选框设置的布尔值，但后来基于某些对象 ID 存在呈现组合框。为什么？

标签： ajax jsf jsf-2 selectbooleancheckbox

【解决方案1】：

从字面上看，实现所需功能的直接方法是根据复选框的选择重新呈现组合框。这是通过以下方式完成的：

<h:selectBooleanCheckbox binding="#{checkbox}">
    <f:ajax render="group" />
</h:selectBooleanCheckbox>
<h:panelGroup id="group">
    <h:selectOneMenu ... rendered="#{checkbox.value}" />
</h:panelGroup>

请注意，代码不需要 bean 中的任何特殊字段，UIComponent 绑定到视图。

当然，如果您的模型中需要它，您也可以通过 bean 属性来实现：

<h:selectBooleanCheckbox value="#{bean.value}">
    <f:ajax render="group" />
</h:selectBooleanCheckbox>
<h:panelGroup id="group">
    <h:selectOneMenu ... rendered="#{bean.value}" />
</h:panelGroup>

另外值得注意的是，此功能也可以通过纯 JavaScript 实现，方法是在 none 和 block 之间切换元素的 display 属性。但请注意，您必须在回发中保持 JSF 组件的状态一致，以防止可能的恶意攻击威胁。

【讨论】：