显示和隐藏功能在JSF

doen't工作我试图隐藏和使用JQuery展示我的文字区JSF。但它不起作用。条件很好，但功能不起作用。有什么问题？我并不是最新的JS，但我开始探索JSF，并在这里以非常奇怪的方式使用JS。在这里你可以在下面看到我的代码。感谢名单显示和隐藏功能在JSF

<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:b="http://bootsfaces.net/ui" 
    xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"> 
<h:head> 
    <title>Add new field</title> 


</h:head> 
<h:body> 
    <script 
     src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> 

    </script> 

    <h:form> 
     <b:commandButton look="link" action="response?faces-redirect=true" 
      value="Response" /> 
     <b:commandButton look="link" action="fields?faces-redirect=true" 
      value="Fields" /> 
    </h:form> 
    <h:form style="margin: 0 auto"> 
     <h3>Adding Form Components</h3> 
     <h:panelGrid columns="1"> 
      <h:outputLabel id="label" for="label">Label:</h:outputLabel> 
      <div> 
       <b:inputText binding="#{infoManageBean.labelInput}" 
        placeholder="Name, Country, etc." required="true" id="labelText" 
        value="#{infoManageBean.field.label}"> 
       </b:inputText> 
       <p:message for="labelText" /> 
       <h:outputText value="#{addFieldValidationBean.label}" /> 
       <br /> <br /> 
      </div> 
      <h:outputLabel for="type">Type:</h:outputLabel> 

      <b:selectOneMenu onchange="handleChange(this.value)" required="true" 
       value="#{infoManageBean.field.type}"> 

       <f:selectItems value="#{fieldManageBean.getFieldTypes()}" 
        var="value" itemLabel="#{value}" itemValue="#{value}" /> 
      </b:selectOneMenu> 
      <br /> 
      <br /> 


      <h:inputTextarea id="itemArea" cols="30" rows="10" /> 


      <h:outputLabel for="color">Required:</h:outputLabel> 
      <b:selectBooleanCheckbox value="#{infoManageBean.field.required}"> 
      </b:selectBooleanCheckbox> 


      <h:outputLabel for="color">Is active:</h:outputLabel> 
      <b:selectBooleanCheckbox value="#{infoManageBean.field.isActive}" /> 
      <input type="hidden" name="method" value=" ADD " /> 
      <b:commandButton look="primary" binding="#{infoManageBean.button}" 
       id="addFieldBtn" validateClient="true" 
       action="#{infoManageBean.insertOrUpdateField()}"></b:commandButton> 
     </h:panelGrid> 
    </h:form> 
    <script type="text/javascript"> 
     function handleChange(selection) { 
      var COMBO_BOX = 'COMBO_BOX'; 
      if (selection == COMBO_BOX) { 
       console.log('visible'); 
       $('#itemArea').show(); 
      } else { 
       console.log('hidden'); 
       $('#itemArea').hide(); 
      } 
     } 
    </script> 
</h:body> 

</html>

来源

2017-04-17 Serg Shapoval

JSF形式，默认情况下，添加前缀到其子IDS看起来是这样的：“形式-ID：儿童身份证”，所以jQuery是无法找到使用选择“元素＃儿童身份证”。

使用prependId形式= “假”：

<h:form style="margin: 0 auto" prependId="false">

或定义的形式ID：

<h:form style="margin: 0 auto" id="formId">

，并使用不同的选择：

$('#formId\\:itemArea')

来源

2017-04-17 20:44:23

感谢名单。有用。疯狂的JSF。讨厌它 –

太棒了。该ID前缀听起来很疯狂，但你会发现它是有用的，当你重复使用的组件和片断，因为它有助于避免IDS崩溃 –

显示和隐藏功能在JSF

回答

相关问题