user3629180
user3629180

Reputation: 27

Send Form fields to jquery

I'm trying to pass all my form fields, to a ajax function where i will insert the user into the database.

But for some reason, my alert (in my JS file) isn't showing anything.

Any ideas what i'm doing wrong?

My HTML:

        <form id="signupForm">
            <input id="signupFormEmail" type="text" name="email" placeholder=" E-mail"><br />
            <input id="signupFormPassword" type="text" name="password" placeholder=" Password"><br />
            <input id="signupFormUsername" type="text" name="userName" placeholder=" User Name"><br />
            <input id="submitSignup" type="button" value="SIGN UP" onclick="signUp(this);">
        </form>

My javascript file:

function signUp(elem)
{   
var postData = $(this).serializeArray();

//$('#myResults').html(postData);
alert($.param($(elem).serializeArray()));

if($(elem).parent().children('#signupFormEmail').val() != ''){      
    // verifica se o email já existe
    $.ajax(
    {
          url: "/newsletter/check-email/",
          type: "POST",
          data: {type:'check',email:$(elem).parent().children('#signupFormEmail').val()}
    }).done(function(response)
    {   
        if(response == -1) {
            $.ajax(
            {
              url: "/newsignup/registare/",
              type: "POST",
              data: postData
            }).done(function(userCreated) {
                if(userCreated == 1) {
                alert('user created');
                    /*
                    $(elem).parent().children('#signupForm').val('');
                    $('#signUpCompleted').show();
                    */
                } 
                else
                {
                    /*$('#signUpError').show();*/
                    alert('user not created');
                }
            })

            //testing
            //$('#signUpCompleted').show();
        }
        else //testing
        {
            $('.emailError').show(); //testing
        }

    }
    );
}
}

Upvotes: 0

Views: 65

Answers (2)

Rodney G
Rodney G

Reputation: 4826

In your onclick attribute, this is not the FORM; this is the button you clicked.

Upvotes: 0

Ammar Khan
Ammar Khan

Reputation: 2585

It looks like you are serializing the element itself. You have to serialize the form, please check this out.

function signUp(elem)
    {   
    var postData = $('form').serialize();
    //$('#myResults').html(postData);
    alert(postData);

    if($(elem).parent().children('#signupFormEmail').val() != ''){      
        // verifica se o email já existe
        $.ajax(
        {
              url: "/newsletter/check-email/",
              type: "POST",
              data: {type:'check',email:$(elem).parent().children('#signupFormEmail').val()}
        }).done(function(response)
        {   
            if(response == -1) {
                $.ajax(
                {
                  url: "/newsignup/registare/",
                  type: "POST",
                  data: postData
                }).done(function(userCreated) {
                    if(userCreated == 1) {
                    alert('user created');
                        /*
                        $(elem).parent().children('#signupForm').val('');
                        $('#signUpCompleted').show();
                        */
                    } 
                    else
                    {
                        /*$('#signUpError').show();*/
                        alert('user not created');
                    }
                })

                //testing
                //$('#signUpCompleted').show();
            }
            else //testing
            {
                $('.emailError').show(); //testing
            }

        }
        );
    }
    }

Upvotes: 2

Related Questions