我有一个xhtml页面，其中可以有0到6个复选框，彼此独立。我想确保在检查完所有选项后，启用提交按钮。假设有3个复选框，仅当单击这3个复选框时，必须启用提交按钮。在JSF / Javascript中寻找解决方案。
答案 0 :(得分：0)
这为您提供了一个非常有价值的示例：http://api.jquery.com/checked-selector/和大量可以复制的代码。
答案 1 :(得分：0)
让我们说复选框位于名为form1的表单中：
var inputs = document.body.form1.getElementsByTagName('input');
var checks = [];
for(var control in inputs){
if(inputs[control].getAttribute('type') == 'checkbox'){
checks.push(inputs[control]);
}
}
//now you have all the checkboxes in a global array checks;
var checkIfCanSubmit = function(){
var totalChecksChecked = 0;
for(var i = 0; i < checks.length; i++){
if(checks[i].checked){
totalChecksChecked++;
}
}
if(totalChecksChecked == checks.length){
document.getElementById('yourSubmitButton').disabled = false;
} else {
document.getElementById('yourSubmitButton').disabled = true;
}
}
//then you attribute the event change to every checkbox
for (var i = 0; i < checks.length; i++){
checks[i].addEventListener('change', checkIfCanSubmit, 1);
}
答案 2 :(得分：0)
以下是我提出的代码，JSF / Seam实际上没有一个干净的解决方案来实现复选框，事实上JSF本身就像天空中的钻石一样。 Groovy更轻巧，更干净。花了我一小时才弄明白，使用JQuery这应该更快更轻松，但那将是我未来的重构努力。感谢Andrey和Mugur。是时候专注于将这个糟糕的东西与CXF Web服务集成。我尽可能地尝试清理并发布解决方案，如果有任何错误我道歉，任何java小孩都应该能够找出错误。
Andrey：您的解决方案适用于任何常规应用程序，只是当JSF组件呈现为HTML时，组件树会生成大量输入复选框，对于6个输入复选框，组件树生成170，这要归功于JSF。难怪为什么Sun卖光了。
<h:form id="cbrRulesForm">
<a4j:region id="googleCompeteRules">
<s:div id="cbrRules">
<div style="height:100px;">
<div class="section-right">
<div>
<s:label styleClass="name" rendered="#{actionBean.ruleResult[0].equalsIgnoreCase('FAIL')}" style="margin-top: -40px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck1" value="#{actionBean.waiveRule1Checked}" disabled="#{!identity.hasRole('Agent')}">
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
</div>
<div>
<s:label styleClass="name" rendered="#{actionBean.ruleResult[1].equalsIgnoreCase('FAIL')}" style="margin-top: -52px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck2" value="#{actionBean.waiveRule2Checked}" >
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
</div>
<div style="clear:both"/>
</div>
</div>
<div>
<div class="section-right" style="margin-top:-20px;">
<s:label styleClass="name" rendered="#{actionBean.ruleResult[2].equalsIgnoreCase('FAIL')}" style="margin-top: -52px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck3" value="#{actionBean.waiveRule3Checked}" >
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
<div style="clear:both"/>
</div>
</div>
<div>
<div class="section-right" style="margin-top:-20px;">
<s:label styleClass="name" rendered="#{actionBean.ruleResult[3].equalsIgnoreCase('FAIL')}" style="margin-top: -52px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck4" value="#{actionBean.waiveRule4Checked}" >
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
</div>
<div style="clear:both"/>
</div>
<div>
<div class="section-right" style="margin-top:-20px;">
<s:label styleClass="name" rendered="#{actionBean.ruleResult[4].equalsIgnoreCase('FAIL')}" style="margin-top: -52px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck5" value="#{actionBean.waiveRule5Checked}" >
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
</div>
<div style="clear:both"/>
</div>
<div>
<div class="section-right" style="margin-top:-20px;">
<s:label styleClass="name" rendered="#{actionBean.ruleResult[5].equalsIgnoreCase('FAIL')}" style="margin-top: -52px;padding-left: 250px;">
<h:selectBooleanCheckbox id="waiveRuleCheck6" styleClass="float: right;" value="#{actionBean.waiveRule6Checked}" >
<a4j:support event="onclick" action="#{actionBean.showButton()}" ajaxSingle="true" reRender="googleCompeteSubmitId"/>
</h:selectBooleanCheckbox>
Waived</s:label>
</div>
<div style="clear:both"/>
</div>
<div style="float:right">
<a4j:commandButton id="googleCompeteSubmitId"
action="#{actionBean.submitDecision()}"
reRender="googleCompeteRules"
limitToList="true"
disabled="#{actionBean.btnDisabled}"
value="Submit"
type="submit"/>
</div>
</s:div>
</a4j:region>
</h:form>
ActionBean.java
@Name("actionBean")
@Scope(ScopeType.CONVERSATION)
@Synchronized(timeout = 60000L)
@AutoCreate
public class ActionBean {
@Out(required = false)
private GoogleCompete googleCompete;
private int checkCount = 0;
private int failCount = 0;
private boolean disableButton = true;
/*
6 WAIVE RULES CHECK BOXES FOR VALIDATION
*/
private boolean waiveRule1Checked;
private boolean waiveRule2Checked;
private boolean waiveRule3Checked;
private boolean waiveRule4Checked;
private boolean waiveRule5Checked;
private boolean waiveRule6Checked;
public boolean isWaiveRule1Checked() {
return waiveRule1Checked;
}
public void setWaiveRule1Checked(boolean waiveRule1Checked) {
if(waiveRule1Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule1Checked = waiveRule1Checked;
}
public boolean isWaiveRule2Checked() {
return waiveRule2Checked;
}
public void setWaiveRule2Checked(boolean waiveRule2Checked) {
if(waiveRule2Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule2Checked = waiveRule2Checked;
}
public boolean isWaiveRule3Checked() {
return waiveRule3Checked;
}
public void setWaiveRule3Checked(boolean waiveRule3Checked) {
if(waiveRule3Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule3Checked = waiveRule3Checked;
}
public boolean isWaiveRule4Checked() {
return waiveRule4Checked;
}
public void setWaiveRule4Checked(boolean waiveRule4Checked) {
if(waiveRule4Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule4Checked = waiveRule4Checked;
}
public boolean isWaiveRule5Checked() {
return waiveRule5Checked;
}
public void setWaiveRule5Checked(boolean waiveRule5Checked) {
if(waiveRule5Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule5Checked = waiveRule5Checked;
}
public boolean isWaiveRule6Checked() {
return waiveRule6Checked;
}
public void setWaiveRule6Checked(boolean waiveRule6Checked) {
if(waiveRule6Checked) {
checkCount++;
} else {
checkCount--;
}
this.waiveRule6Checked = waiveRule6Checked;
}
public boolean isBtnDisabled() {
return disableButton;
}
public void showButton() {
disableButton = checkCount != failCount;
}
private GoogleCompete fetchInformationFromAmazon(long customerAccountId) {
googleCompete = getInfoFromJavaCXFWebService();
ruleResult = googleCompete.getCbrRules().toArray(ruleResult);
for (String s: ruleResult) {
if(s.equals("FAIL")) {
failCount++;
}
}
return googleCompete;
}
public void submitDecision() {
}