3

I currently have the following Javascript action on one of my SurveyGizmo surveys.

The purpose of it is to calculate the exact age (by a specific date) of when someone specifies their birth date.

However, we often prefill info into our surveys. The problem is that the script doesn't trigger when their is a date already prefilled into the dob textbox. Is there a way to ensure the age textbox updates whenever the page is loaded as well as when the textbox is changed?

Thank you for any help you may provide/

$SG(document).ready(function(){
    if ($SG('body').attr('id') != 'app') {
        var textbox = $SG('#sgE-2604126-33-6-element');  //dob box
        $tgtbox = $SG("#sgE-2604126-33-254-element"); //age box
        $minage = 21;  //minimum age
        $errortxt = 'You must be at least ' + $minage + ' years old to continue';

        textbox.change(function(){
            console.log($SG(this).val());
            var birth = $SG(this).val();

            function getAge(birth) {

                var d = new Date(2016,3,16);
                var n = d.getTime();
                console.log(n);

                var c = Date.parse(birth);
                console.log(c);

                var a = (d - c) /(1000*60*60*24*365);
                var result=(a*100)/100;
                console.log(result);

                $tgtbox.val(result);
                //alert(result);
            }
            getAge(birth);
        });
    }

    //submit validation  
    $('.sg-survey-form').submit(function(e){

        if($tgtbox.val() < $minage) {
            //alert($tgtbox.val());
            //alert($minage);

            $('.sg-error-message').text($errortxt).fadeIn('slow');
            e.preventDefault();

        }

    });  //end submit validation


});
Alexander Mikhalchenko
  • 4,525
  • 3
  • 32
  • 56
Webmetz
  • 33
  • 2
  • Can you please explain how you "prefill info" into the surveys? It's important to know how and when this "prefill" is done, so we can recommend a method to update the display at the right time. – terrymorse Feb 20 '16 at 00:10

2 Answers2

1

Your code isn't setting the age display until a change event occurs in the text box. If there's something pre-loaded in the text box, you need to initialize the age display.

To initialize the age display, looks like you just need to call the code you're firing upon textbox.change once at load time. Like this:

function setAge() {
    console.log($SG(this).val());
    var birth = $SG(this).val();

    function getAge(birth) {

        var d = new Date(2016,3,16);
        var n = d.getTime();
        console.log(n);

        var c = Date.parse(birth);
        console.log(c);

        var a = (d - c) /(1000*60*60*24*365);
        var result=(a*100)/100;
        console.log(result);

        $tgtbox.val(result);
        //alert(result);
    }
    getAge(birth);
}

// run upon textbox change event
textbox.change(function() { setAge(); } );

// run right now
setAge();

Or here's the code snippet without the unnecessary bits:

function setAge() {
    console.log($SG(this).val());
    var birth = $SG(this).val();
    var d = new Date(2016,3,16);
    var n = d.getTime();
    var c = Date.parse(birth);
    var a = (d - c) /(1000*60*60*24*365);
    var result=(a*100)/100;
    $tgtbox.val(result);
}

// update age upon textbox change event
textbox.change(function() { setAge() } );
// update age right away
setAge();
terrymorse
  • 6,771
  • 1
  • 21
  • 27
0

It looks like you'll have to do it by running the check function regularly.

Here's some code snippet for that:

$.fn.allchange = function (callback) {
    var me = this;
    var last = "";
    var infunc = function () {
        var text = $(me).val();
        if (text != last) {
            last = text;
            callback();
        }
        setTimeout(infunc, 100);
    }
    setTimeout(infunc, 100);
};


$("#myInput").allchange(function () {
    alert("change!");
});
Community
  • 1
  • 1
Alexander Mikhalchenko
  • 4,525
  • 3
  • 32
  • 56