Non spaventatevi dal titolo.
In realtà è un giochetto semplice perchè vorrei che almeno 1 su 7 checkbox è cliccato (selezionato)
Viene una lunga if e l'ho spezzata in due.
Dovrebbe funzionare ma il messaggio di errore appare sempre e anche in caso positivo.
Però questo caso positivo non avviene mai anche se l'if è corretto
Allego il codice in html ed è anche on-line:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Validation inside dialog</title>
</head>
<script type="text/javascript">
// <---- VENTAÑAS DE PARAMETERES---->
function start(){
var status="true";
if ( document.getElementById("chkHobby").checked == false || document.getElementById("chkWork").checked == false || document.getElementById("chkOthers").checked == false || document.getElementById("chkSpanishSpeaking").chec ked == false )
{
status="false"
if( status=="false" || document.getElementById("chkForeignLang").checked == false || document.getElementById("chkPlacementInSpanish").c hecked == false || document.getElementById("chkMakeNewFriends").check ed == false )
{
//alert(show+" cannot be blank. ");
var objErrDiv = document.getElementById('divChkErr');
objErrDiv.innerHTML="Please select atleast one reason to learn spanish.";
objErrDiv.style.padding='4px 4px';
objErrDiv.style.visibility='visible';
objErrDiv.style.width='100%';
objErrDiv.style.margin='0px 0px 2px 0px';
objErrDiv.style.color="red";
return false;
}}
else {
var objErrDiv = document.getElementById('divChkErr');
objErrDiv.innerHTML=""; }
}
}
$(document).ready(function() {
});
</script>
<body>
<form id="reason">
<table id="tblReasons2Learn1" cellpadding="5" cellspacing="0" border="0" width="50%;" style="margin-left:78px;">
<tr>
<td width="16%" align="right">Hobby</td>
<td width="16%">
<input type="checkbox" id="chkHobby" name="chkHobby" />
</td>
<td width="16%" align="right">Work</td>
<td width="16%" align="left">
<input type="checkbox" id="chkWork" name="chkWork" />
</td>
<td width="16" align="right">Others</td>
<td width="17%" align="left">
<input type="checkbox" id="chkOthers" name="chkOthers" />
</td>
</tr>
</table>
<table id="tblReasons2Learn2" cellpadding="5" cellspacing="0" border="0" width="100%;">
<tr>
<td width="50%" align="right">Traveling to a Spanish speaking country</td>
<td width="50%">
<input type="checkbox" id="chkSpanishSpeaking" name="chkSpanishSpeaking" />
</td>
</tr>
<tr>
<td width="50%" align="right">To learn a new foreign language</td>
<td width="50%">
<input type="checkbox" id="chkForeignLang" name="chkForeignLang" />
</td>
</tr>
<tr>
<td width="50%" align="right">To get placement in a job related to Spanish</td>
<td width="50%">
<input type="checkbox" id="chkPlacementInSpanish" name="chkPlacementInSpanish" />
</td>
</tr>
<tr>
<td width="50%" align="right">To make new friends</td>
<td width="50%">
<input type="checkbox" id="chkMakeNewFriends" name="chkMakeNewFriends" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="button" value="Clicca qui" onclick="start()" />
</td>
</tr>
<tr>
<td colspan="2">
<div id="divChkErr" class="errorStyling"></div>
</td>
</tr>
</table>
</form>
</body>
</html>