I am using JSF 2.0. I have two check boxes (both are h:selectBooleanCheckBox). The requirement is to enable the second check box on click of the first check box. Here is how the code looks like:
<h:selectBooleanCheckbox id="chkbox1"
value="#{dataTableRow.employeeMBean.displayStatus}"
onclick="updateDisplayStatus(this);return false;">
<a4j:ajax execute="chkbox1" render="chkbox1, chkbox2"></a4j:ajax>
</h:selectBooleanCheckbox>
<h:selectBooleanCheckbox id="chkbox2"
value="#{dataTableRow.employeeMBean.publicStatus}"
disabled="#{!dataTableRow.employeeMBean.displayStatus}">
</h:selectBooleanCheckbox>
function updatePublicStatus(obj){
var currentValue = obj.checked;
updatePublicStatusJS(currentValue);
if(currentValue == true){
document.getElementById("summaryForm:solutionsTable:"+solnDtIdx+":editPanel:0:chkbox2").disabled = "false";
}
else{
document.getElementById("summaryForm:solutionsTable:"+solnDtIdx+":editPanel:0:chkbox2").disabled = "disabled";
}
}
<a4j:jsFunction name="updatePublicStatusJS" action="#{employeeMBean.updatePublicStatus}"
render="chkbox2">
<a4j:param name="param1" assignTo="#{dataTableRow.employeeMBean.displayStatus}"/>
</a4j:jsFunction>
There are two problems:
a4j:jsFunction
is never getting
called.I am not sure why the second checkbox is not enabled. Please let me know if anymore code or explanation is needed.
Thanks in advance.
The root cause: <a4j:jsFunction>
was not required. So I removed the onclick and executed the <h:selectBooleanCheckbox>
using the <a4j:ajax execute="@this" render="chkbox2"/>
. This way check box value gets set as soon I select the fist check box and the second check box is rendered with the updated value (because of the 'render' attribute).