0

Currently the date and year is being verified but I would like to add a checkbox to the list.

Form code:

var html = '';
    html += '<div class="ac-overlay"></div>';
    html += '<div class="ac-container">';
    html += '<h2>' + settings.title + '</h2>';
    html += '<p>' + copy.replace('[21]','<strong>'+settings.minAge+'</strong>'); + '</p>';
    html += '<div class="errors"></div>';
    html += '<div class="fields"><select class="month">';for(var i=0;i<months.length;i++){
    html += '<option value="'+i+'">'+months[i]+'</option>'}
    html += '</select>';
    html += '<input class="day" maxlength="2" placeholder="01" />';
    html += '<input class="year" maxlength="4" placeholder="2016"/>';
    html +="<br><br>";
    html +='<p><input class="smoker" type="checkbox"/>Please verify that you are a smoker.</p>';
    html +="<br>";
    html += '<button>Submit</button></div></div>';

Validation script:

 validate : function(){
 _this.errors = [];
 if (/^([0-9]|[12]\d|3[0-1])$/.test(_this.day) === false) {
 _this.errors.push('Day is invalid or empty');
 };
 if (/^(19|20)\d{2}$/.test(_this.year) === false) {
 _this.errors.push('Year is invalid or empty');
 };
 _this.clearErrors();
 _this.displayErrors();
 return _this.errors.length < 1;
 },

I played around a bit with the following code but something is missing: 

if ("Not sure what to enter here to validate the checkbox.".test(_this.smoker) === false) {
_this.errors.push('You have not selected if you are a smoker');
};
Jesper
  • 202,709
  • 46
  • 318
  • 350
RAM
  • 1
  • What framework are you using for validation? Also, there's no way of validating that a checkbox has not been checked because the user is not a smoker, or if the user did not check the checkbox for another reason. – Heretic Monkey Oct 10 '16 at 14:33
  • @MikeMcCaughan once the Submit button is triggered the the Validation Script runs. Currently in the block above there is no section checking the state of the checkbox. Adding the last bit of code I posted to the validation will try to validate the checkbox but I do not know what to add to that code to validate as true if the checkbox it checked. – RAM Oct 10 '16 at 14:52
  • Then you just want to check if the checkbox is checked? http://stackoverflow.com/q/9887360/215552. – Heretic Monkey Oct 10 '16 at 14:59

1 Answers1

0

Was a bit of a work around but ended up changing the Checkbox to enable and disable the verify button.

$(document).ready(function(){
                $('#isAgeSelected').change(function(){
                    if(this.checked)
                    $('#autoUpdate').fadeIn('slow');
                    else
                    $('#autoUpdate').fadeOut('slow');
                });
                });

                html +="<br><br>";
                html += '<p><input type="checkbox" id="isAgeSelected"/> Please verify the date above is correct.';
                html += '<div id="autoUpdate" class="autoUpdate" style="display:none"><button>Submit</button></div>';
                html += '</div></div>';

See how it works here: http://jsfiddle.net/3WEVr/1135/

RAM
  • 1