Checkbox Validation using Spry in ContactForm Solution Pack

[Groshko]

Hi there,

I have one check box on a form that needs to be ticked before the submission is made.
I have looked at the Spry for the checkbox and have selected it as a required field.
However if I don't tick this box the form is still processed.

I must be missing something right in front of me. I am assuming that i can achieve this with just Spry, like all the other fields in the form.


This is my checkbox...

<span id="sprycheckbox1">
<input name="Terms" type="checkbox" id="Terms" value="1">
<span class="checkboxRequiredMsg">Please make a selection.</span></span></span>


And this is my spry code at the bottom of the form

var sprycheckbox1 = new Spry.Widget.ValidationCheckbox("sprycheckbox1", {validateOn:["blur", "change"]});


Any advice would be appreciated.

[Jason Byrnes]

A spry check box does not offer a required attribute to make it required when the form submits.


Instead, you should use sever validation on the checkbox to make it required.


In the server behaviors list, double click the server validation server behavior.

Select the Required / Not Blank from the validation type, then click the lightning bolt next to server variable and select the terms checkbox from the form collection.

Click the plus button to add this validation to the list.

[neilo]

Hiya Jason,

Are you saying that the spry checkbox validation doesn't work alongside server-side validation, or that it just isn't an effective/reliable way of validating it? (Or that it just doesn't work?)

[Jason Byrnes]

Spry validation is always less effective and reliable than server validation since it relies on java script which can be turned off in the clients browser.

spry Can work alongside server validations.

In my experience server side validation is less temperamental than spry or other javascript based validations.

For example, the reason spry is not working in the OP's form, is the empty onsubmit attribute in the form tag:
<form action="" method="post" name="emailContact" id="emailContact" onsubmit="">

This is causing the spry validation to fail on the checkbox when the form submits. Remove the empty onsubmit attribute in the form tag:
<form action="" method="post" name="emailContact" id="emailContact">

and spry validation will function.

[neilo]

Cheers Jason, thanks for all the info (At some point you may need to start billing me for it all).

I was looking into the onsubmit part of the form tag (I had some vague memory of s script I picked up somewhere, having forgotten about Spry altogether) and eventually

found it - also containing javascript - but that script worked by disabling the submit button until the 'I accept the terms and conditions' checkbox had been ticked.

I thought it might help Groshko a bit, but suppose that's probably only effective in conjunction with serverside validation too. I attach the instructions anyway.

---------------------------------------------------------------------------------------

Hiya Groshko,

I may be wrong, but I believe that having a few of the server error elements with the same name (nameServerError) might cause you problems with the serverside

validations and the error messages on the page . I believe that each $WAFV_Errors (as listed in the block of WA Server Validations near the beginning of your page)

should refer to a uniquely named server error elements. (I think the 'nameServerError' originally just applied to the 'Name' field).

So for instance, in line 15 in the contact_php file:

$WAFV_Errors .= WAValidateRQ(((isset($_POST["Address"]))?$_POST["Address"]:"") . "",true,2);

refers to an input 2, which is the Address input field so perhaps in that block you could change the references to 'nameServerArea' to 'AddressServerError', i.e:


<span id="sprytextarea1">
<textarea name="Address" class="inputText" id="Address" onblur="if (document.getElementById('AddressServerError'))

document.getElementById('AddressServerError').styl e.display='none'" ><?php echo(ValidatedField("contact","Address")) ?

></textarea>
<span class="textareaRequiredMsg">A value is required.</span></span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "3" . ",") !== false || "3" == "")) {
if (!(false)) {
?>
<span id="AddressServerError" class="textfieldServerError">Please enter your address here.<br />
</span>
<?php //WAFV_Conditional contact.php contact(2:)
}
}
}?>

---------------------------------------------------------------------------------------

Attachment is the bit of 'diable button' code from Dynamic Drive.