Is there any option to set flag to true and hide <p:inputText id="name" value="#{mybean.value}" /> on change?
JSF code below
<h:form>
<p:selectOneMenu style="width:150px" id="id" onchange="onCall()">
<f:selectItem itemLabel="Select" itemValue=""></f:selectItem>
<f:selectItem itemLabel="Other" itemValue="Other"></f:selectItem>
</p:selectOneMenu>
<p:selectBooleanCheckbox id="flag"/>
<p:inputText id="name" value="#{mybean.value}/>
</h:form>
Please give me an idea to solve my issue
You have two ways to achieve this, jQuery or Normal JSF.
JSF
Bean
private Boolean renderInputText;
public void setRenderInputText(Boolean renderInputText) {
this.renderInputText = renderInputText
}
public Boolean getRenderInputText() {
return renderInputText;
}
xhtml
<p:selectBooleanCheckbox id="flag" value="{bean.renderInputText}" >.
<p:ajax update="inputPanel" />
</p:selectBooleanCheckbox>
<h:panelGroup id="inputPanel">
<p:inputText rendered="{bean.renderInputText}"/>
</h:panelGroup>
jQuery
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<!-- This can be located either in the facelet or in external js file-->
<script>
$(function() {
PF('selectWV').jq.change(function() {
if (PF('selectWV').isChecked()) {
PF('buttonWV').jq.show();
} else {
PF('buttonWV').jq.hide();
}
})
})
</script>
</h:head>
<h:body>
<h:form id="form">
Accept Terms: <p:selectBooleanCheckbox
widgetVar="selectWV" />
<p:commandButton value="Register" widgetVar="buttonWV"
style="display: none" />
</h:form>
</h:body>
</html>
A small working example (jQuery version) can be found on github, two main files terms.xhtml and terms.js
And an online Demo.
Hope this Helps.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With