Why is my jQuery function not being called correctly?

Question

I have this jQuery function that is using another jQuery library called html5csv.js (which explains some of the CSV stuff you will see)

Here is it:

function validateNewQuiz()
{
    CSV.begin("#upload_csv").go(function(e,D)
    { 
        if (e) 
        {
            return console.log(e); 
            alert("Sorry, an error occured");
        }

        var s = "";


        for (var i = 0; i <= D.rows.length - 1; i++) 
        {
            s +=D.rows[i].join(',');
            s += "\n";
        }

        var fullString = s;

        if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
        {
            return true;
        }
        else
        {
            return false;
        }

    });
}

Here is how I am trying to call my function, from an onsubmit within my form:

<form method="post" action="createplay.php" onsubmit="return validateNewQuiz();" enctype="multipart/form-data">

My function has been thoroughly tested, along with my regex to make sure it was working. When I decided to implement it into my large document, and wrap it around function validateNewQuiz(){ //my function here } , it stopped working.

I did not make my tests with the onsubmit part within my form either.

Does anyone have any suggestions to why my form is always submitting, even when my function should be returning false?

You are returning true or false from the callback function that is passed into go(), so validateNewQuiz is actually returning undefined. If the CSV library is asynchronous (and looks like it is), you won't be able to use it this way in on an onsubmit handler. — Matt Greer
– Matt Greer, Commented Aug 25, 2013 at 6:48
@MattGreer - Do you have any other alternatives then? I need to validate my form client side with Javascript before it is posted to my PHP. — Fizzix
– Fizzix, Commented Aug 25, 2013 at 6:50
your outer function validateNewQuiz() isnt actually returning anything. You are only returning the value of your CSV function, but then doing nothing with it. Have your validateNewQuiz() fn actually return the value of the CSV function. — gos1
– gos1, Commented Aug 25, 2013 at 7:14
@gos1 - Could you post an example of that within the answer section please? — Fizzix
– Fizzix, Commented Aug 25, 2013 at 9:03

gos1 · Accepted Answer · 2013-08-25 20:43:52Z

The onsubmit event handler allows the submission to proceed if it is passed a true value by the validation function, and does not allow the submission to proceed if it receives a false value. In your case, the inner function is returning a true or false value, but this value is not being passed to the outer validateNewQuiz function, so the true/false result of the validation is not being passed to the onsubmit event handler. To fix this, just return the value of the CSV function.

function validateNewQuiz()
{
    var csvValidation = CSV.begin("#upload_csv").go(function(e,D)
    { 
        if (e) 
        {
            return console.log(e); 
            alert("Sorry, an error occured");
        }

        var s = "";


        for (var i = 0; i <= D.rows.length - 1; i++) 
        {
            s +=D.rows[i].join(',');
            s += "\n";
        }

        var fullString = s;

        if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
        {
            return true;
        }
        else
        {
            return false;
        }

    });
    return csvValidation;
}

pckill · Accepted Answer · 2013-08-25 09:51:40Z

0

You can make a button that would be calling your function:

<button onclick="validateNewQuiz()">Submit</button>

... and submitting the form once it is validated:

function validateNewQuiz()
{
    CSV.begin("#upload_csv").go(function(e,D)
    { 

        //...

        if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
        {
            $("form").submit();
        }
    });
    return false;
}

answered Aug 25, 2013 at 9:51

pckill

3,75939 silver badges49 bronze badges

Collectives™ on Stack Overflow

Why is my jQuery function not being called correctly?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related