Search code examples
javascriptjqueryajaxreferenceerror

Uncaught ReferenceError: slickcontactparse is not defined


I am using a ajax-driven contact form and receive the error "ReferenceError: slickcontactparse is not defined".

Am not sure how to declare the function. Please help!!

js

$(document).ready(function(){

 $('#slickform').submit(
    function slickcontactparse() {

        // EMAIL VALIDATION FUNCTION
        var emailReg = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);

        // EDIT THIS SECTION IF DIFFERENT FORM ELEMENTS
        // Values
        var successmessage = "Thank you for email, we will be in contact soon!";
        var failedmessage = "There was a problem, please try again!";
        var usersname = $('#name');
        var usersemail = $('#email');
        var usersphone = $('#phone');
        var userssubject = $('#subject');
        var userscomment = $('#comment');
        var usershuman = $('#human');
        var isvalid = 1;
        var url = "slickform.php";

        //Checking information is correct before sending data


        //CHECKING EMAIL IS PRESENT AND IS VALID
        if (usersemail.val() == "") {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Insert Your Email!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }

        var valid = emailReg.test(usersemail.val());

        if(!valid) {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Enter A Valid Email!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING EMAIL IS PRESENT AND IS VALID


        //CHECKING USERS NAME IS PRESENT
        if (usersname.val() == "") {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Insert Your Name!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING USERS NAME IS PRESENT

        //CHECKING USERS PHONE NUMBER IS PRESENT AND IS ONLY NUMERIC
        if (usersphone.val() == "") {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Insert Your Phone Number!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }

        var EnteredValue = $.trim(usersphone.val());
        var TestValue = EnteredValue.replace(" ", "");
         if (isNaN(TestValue)) {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Enter A Valid Phone Number!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING USERS NAME IS PRESENT

        //CHECKING SUBJECT WAS SELECTED
        if (userssubject.val() == "") {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Please Select A Subject!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING SUBJECT WAS SELECTED

        //CHECKING THE USER IS HUMAN
        if (usershuman.val() != 15) {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('Your Are You Human Math Is Incorrect!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING THE USER IS HUMAN

        //CHECKING THE USER IS HUMAN
        if (userscomment.val() == "") {
            $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
            $(".errorcontainer").html('You Forgot To Leave A Message!');
            $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
            $('input[type=submit]', $("#slickform")).removeAttr('disabled');
            return false;
        }
        //CHECKING THE USER IS HUMAN

        /* 
         *
         * POSTING DATA USING AJAX AND
         * THEN RETREIVING DATA FROM PHP SCRIPT
         *
        */

        $.post(url,{ usersname: usersname.val(), usersemail: usersemail.val(), usersphone: usersphone.val(), userssubject: userssubject.val(), userscomment: userscomment.val(), usershuman: usershuman.val(), isvalid: isvalid } , function(data) {

            if(data == 'success'){

                $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
                $(".successcontainer").html(successmessage);
                $(".successcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
                $("#name").val('');
                $("#email").val('');
                $("#phone").val('');
                $("#subject").val('');
                $("#comment").val('');
                $("#human").val('');
                $('input[type=submit]', $("#slickform")).removeAttr('disabled');

            } else {

                $(".slickbutton").animate({marginTop:'50px'},1000).delay(6000).animate({marginTop:'0px'},1000);
                $(".errorcontainer").html(failedmessage);
                $(".errorcontainer").delay(1200).fadeIn(1000).delay(4000).fadeOut(1000);
                $('input[type=submit]', $("#slickform")).removeAttr('disabled');
                return false;

            }

        });


    }

);

});

Here's the php:

if(isset($_REQUEST["isvalid"])){

$youremail = "test@test.com";
$usersname = $_POST["usersname"];
$usersemail = $_POST["usersemail"];
$usersphonenumber = $_POST["usersphone"];
$mailsubject = "Contact From Your Slickform";
$subject = $_POST["userssubject"];
$usersmessage = $_POST["userscomment"];
$message =

"$usersname has contacted you from your site.

$subject:

Their Message is as follows:

$usersmessage

...............................................

Contact details:

Phone Number: $usersphonenumber
Email Address: $usersemail"; 

$headers = 'From:' . $usersemail . "\r\n";
mail($youremail, $mailsubject, $message, $headers);

echo "success";

} else {

echo "failed";

}

Any help is appreciated. Thank you!


Solution

  • Either do this:

    $('#slickform').submit(function() { // remove the callback fn name
    

    or make a global function and use it like this:

    slickcontactparse() {
       // all your code
    }
    
    $(document).ready(function(){
        $('#slickform').submit(slickcontactparse); // call it here as callback
    });