asked on

jQuery: Checkbox Validation Alert

Hi there,

I am new to jQuery and am having some troubles with validation. I have a checkbox to agree to our policy and I want an alert(); to happen if the user submits the page without having checked it. Right now it will display an text message on the page if they haven't checked the checkbox, which I want, but I also want that alert() to happen.

What am I doing wrong? The below code doesn't function at all, but how would I change it to get the desired effect?

Thanks.

jQuery.validator.addMethod("agree", function(value, element) {
	if ($('#terms').val() != "on") { 
alert("Please click to agree."); }	
			
	}, "");

....

<input name='terms' id='terms' class="required agree"  type='checkbox'>

Open in new window

microvb

maeve100,

Which "validator" plugin for jQuery are you using ? I would like to do some testing. I believe I see the problem, but want to make certain before posting a solution.

This might be a stupid question, but are you hooking the onsubmit for the form, or is the page just submitting directly.

Thanks,

Dan.

maeve100

ASKER

I am using a modified version of this demo:
http://jquery.bassistance.de/validate/demo/errorcontainer-demo.html

Thanks!

maeve100

ASKER

Sorry - There is no onsubmit, its just a plain page submit when the input button is clicked.

microvb

maeve100:

The example here looks more current, and provides details on how to validate a checkbox as required.

http://jquery.bassistance.de/validate/demo/

It is different than your current code though as you no longer need to specify "required" in the class param of the input tag.

Javascript (just to validate checkbox)

$().ready(function() {
       $("#myform").validate({
		rules: {
			terms: "required"
		},
		messages: {
			terms: "Please accept our policy"
		}
	});
});

Open in new window

And the elements

<form id="myform" method="post">
	<input type="checkbox" class="checkbox" id="terms" name="terms" />
        <input type="submit" class="submit" value="Submit" />
</form>

Open in new window

It seems that when they updated their code to support checkboxes the developer also simplified the process of validation a bit more.

Dan

maeve100

ASKER

Unfortunately, that doesn't seem to give an alert() to the screen. The link I sent was to the version that I am using - because I need to have the error codes display in a separate box (as in the demo I sent) not inline with the form (in the link you included.) But either way, I need the alert that displays on page AND a Javascript alert("Please click to agree.").

Thanks!

ASKER CERTIFIED SOLUTION

microvb

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial