Checking a checkbox after checking other sections of the form

Question

Checking a checkbox after checking other sections of the form

I have created a form that will only be submitted if every field in the form is filled in and the password fields match. I need to add some code that will check if one checkbox is selected. If selected, the form will be submitted.

My code:

<!DOCTYPE HTML>
<html>
<head>
<title>Web Site Registration Form</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript">


function confirmPassword() {
    if(document.forms[0].password_confirm.value
    != document.forms[0].password.value) {
    window.alert("You did not enter the same password");
    }
}


function setFocus(){
document.forms[0].visitor_name.focus();}

function confirmSubmit(){
if(document.forms[0].name.value=="" ||
document.forms[0].name.value=="Enter your name")
{window.alert('Enter your name');
return false;}
else if(document.forms[0].elements[1].value=="")
{window.alert('Enter your e-mail address');
return false;}
else if(document.forms[0].elements[2].value=="")
{window.alert('Enter your password');
return false;}
else if(document.forms[0].elements[3].value=="")
{window.alert('Enter your password again');
return false;}
return true;}
</script>
</head>
<body>
<h1>Web Site Registration Form</h1>
<h2>Personal Information</h2>
<form action="FormProcessor.html" method="get"
enctype="application/x-www-form-urlencoded" onsubmit="return confirmSubmit()">

<p>Name</p>
<p><input type="text" name="name" size="50" placeholder="Enter your name"><br> </p>
<p>E-mail address</p>
<p><input type="text" name="email" size="50" 
    placeholder="Enter your e-mail address"></p>

<p>Enter a password that you can use to manage your subscription
online</p>
<p><input type="password" name="password" size="50"></p>
<p>Type the password again to confirm it</p>
<p><input type="password" name="password_confirm" size="50" onblur="confirmPassword()"></p>

<h2>Preferences</h2>

<p>Select areas of interest (select at least one)</p>
<p><input type="checkbox" name="interests"
     value="entertainment">Entertainment<br />
<input type="checkbox" name="interests"
     value="business">Business<br />
<input type="checkbox" name="interests"
     value="music">Music<br />
<input type="checkbox" name="interests"
     value="shopping">Shopping<br />
<input type="checkbox" name="interests"
     value="travel">Travel</p>
<p><input type="submit"></p>
</form>
</body>
</html>

I tried using @victory's code to check the scope of a checkbox:

function confirmSubmit(form){
        if(form.querySelector(":checked")) {

        return true;
    } else {
        window.alert("Select at least one preference");
        return false;
    }
}

To do the code above, I need to change the "form action line" of my html to:

<form action="FormProcessor.html" method="get"
enctype="application/x-www-form-urlencoded" onsubmit="return confirmSubmit(this)">

When I add this change to my html code, it stops all other validation functions on the page.

Also for reference on my form page the user is submitted:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Form Processor</title>
<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1" />
<link rel="stylesheet" href="js_styles.css" type="text/css" />
</head>
<body>
<script type="text/javascript">
/* <![CDATA[ */
document.write("<h1>Your form has been submitted!</h1><h2>You entered the following data:</h2>");
var formData = location.search;
formData = formData.substring(1, formData.length);
while (formData.indexOf("+") != -1) {
    formData = formData.replace("+", " ");
}
formData = unescape(formData);
var formArray = formData.split("&");
for (var i=0; i < formArray.length; ++i) {
document.writeln(formArray[i] + "<br />");
}
/* ]]> */
</script>
</body>
</html>

Also, if you test it with the submit page, be sure to change the name of the submit page in the html form action so that you have the code saved as.

--- EDIT ---

I solved the problem using:

{
var chkd = document.forms[0].interests1.checked || document.forms[0].interests2.checked|| document.forms[0].interests3.checked|| document.forms[0].interests4.checked||document.forms[0].interests5.checked

if (chkd == true)
    {return true;
    }
    else
    {
    window.alert ("Please check a checkbox")
    }
    return false;
    }