Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

Hi i have a contact form on my site, In this form i got a javascript checkbox button.

This is the end code of my form: this div tag is my checkbox: 

<p><label for="agree">(*) I agree whit the transport terms and conditions:</label><div id="cb"></div></p>
<p>hi
<input name="Submit / Send" type="submit" class="submit" id="Submit / Send" tabindex="370" value="Submit / Send" />
<p id="error_zone" style="visibility:hidden;">Errors: There are some errors in the form. Please correct them.</p>
</p>

This is the javascript text button:

<script type="text/javascript">
    var cbh = document.getElementById('cb');
    var val = '1';
    var cap = '';

    var cb = document.createElement('input');
    cb.type = 'checkbox';
    cbh.appendChild(cb);
    cb.name = val;
    cb.value = cap;
    cbh.appendChild(document.createTextNode(cap));
</script>

also i make use of spry validation for my other form elements. I would like to validate the checkbox with javascript to create a captcha checkbox! Is it posible to let pop up a validation masage and and not disturbe the spry validation?! Its important that if javascript is turned off the form als can't submit any more.

Hope someone can help me. thanx alot for your time!

i'm trying to encomplish this: http://uxmovement.com/forms/captchas-vs-spambots-why-the-checkbox-captcha-wins/

snippet of spry validation:

<script type="text/javascript">
var errorsOnSubmit = function(form){
 var ret = Spry.Widget.Form.validate(form);
 var errorZone= document.getElementById('error_zone');
 if (!ret){
      errorZone.style.visibility = 'visible';
      errorZone.style.backgroundColor = 'red';
 }else{
      errorZone.style.visibility = 'hidden';
 }
 return ret;
}
</script>
<script type="text/javascript">
var spryselect1 = new Spry.Widget.ValidationSelect("spryselect1", {isRequired:false,  invalidValue:"1", validateOn:["blur", "change"]});
var spryselect2 = new Spry.Widget.ValidationSelect("spryselect2", {isRequired:false, invalidValue:"1", validateOn:["blur", "change"]});
var spryselect3 = new Spry.Widget.ValidationSelect("spryselect3", {isRequired:false, invalidValue:"1", validateOn:["blur", "change"]});
share|improve this question

2 Answers

up vote 0 down vote

u can try this code 

function agree() {
if (document.getElementById("cb").checked){
alert("checked");
document.getElementById("Send").setAttribute(disabled,"false");
document.getElementById(seny).
}else{
alert("unchecked");
document.getElementById("Send").disabled="true";
}
}

<p>
            <input type="checkbox" id="cb" onclick="javascript:agree();">
            <label for="agree">
                (*) I agree whit the transport terms and conditions:
            </label>
        </p>
        <p id="seny">
            <input disabled="disabled" name="Send" type="submit" class="submit"
                id="Send" tabindex="370" value="Submit / Send" />
        </p>
share|improve this answer
i don't think this will work out and a spam bot can also fill in the chekbox i would like to encomplish this: uxmovement.com/forms/… – phj Apr 5 '12 at 7:08
up vote 0 down vote

Give an ID to the checkbox after you created the element

cb.type = 'checkbox';
cb.id = 'mycheckbox';
cbh.appendChild(cb);

Now, you can select the element using document.getElementById('mycheckbox') and the validate it.

Here is a snippet to validate the checkbox

var myform = document.forms("yourformname");
myform.onsubmit = function() {

    //validate the checkbox
    var checkb = document.getElementById('mycheckbox');
    if(checkb.checked != true) { 
       alert('not checked');
    }

    //rest of the validation
};

Update 1:

Haven't tested but should work

var errorsOnSubmit = function(form){

  //validate the checkbox
  var checkb = document.getElementById('mycheckbox');
  if(checkb.checked != true) { 
     alert('not checked');
  }

 var ret = Spry.Widget.Form.validate(form);
 var errorZone= document.getElementById('error_zone');
 if (!ret){
      errorZone.style.visibility = 'visible';
      errorZone.style.backgroundColor = 'red';
 }else{
      errorZone.style.visibility = 'hidden';
 }
 return ret;
}
share|improve this answer
thank you! but how can i make a validation function? sorry i realy suck in javascript is this right?: function checkform() { if (!document.mycheckbox.checked) { // box is not checked return false; } – phj Apr 5 '12 at 7:09
@phj, check my update – Starx Apr 5 '12 at 7:14
that's working but pops up when i open the page in my localhost if it is possible to tjeks that script when submitted the form whit the submit button and tell the form he can only submit when javascript is enabled i got my checkbox captcha working? – phj Apr 5 '12 at 7:48
i try to and this to the code: frm.onsubmit = cb_it; but it won't work do you know what i'm doing wrong thanks alot for your help your awesome!! – phj Apr 5 '12 at 8:51
@phj, may be my update will help to understand the whole thing – Starx Apr 5 '12 at 9:04
show 5 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.