php $POST[] empty after Ajax call from jquery

Question

Form :

<form method="post" id="loginForm">
    <div class="form-group">
        <label for="email-signin">Email address:</label>
        <input type="email" class="form-control" id="email-signin" name="email-signin">
    </div>
    <div class="form-group">
        <label for="pwd-signin">Password:</label>
        <input type="password" class="form-control" id="pwd-signin" name="pwd-signin">
    </div>
    <div class="checkbox">
        <label>
            <input type="checkbox"> Remember me</label>
    </div>
    <button type="submit" class="btn btn-default" id="signIn" name="signIn">Sign In</button>
    <div id="error">
        <!-- error will be shown here ! -->
    </div>
</form>

jquery :

$("#signIn").on("click", function(e) {

   e.preventDefault();

    var values = $("#loginForm").serialize();

    console.log( values );

    $.ajax({
        type: "POST",
        url: "../php/BusinessLayer/User.php",
        data: values,
        beforeSend: function() { $("#error").fadeOut() },
        success :  function(response)
        {
            console.log("Success");
            if(response=="ok"){

            }
            else{
                $("#error").fadeIn(1000, function(){
                    $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> &nbsp; '+response+' !</div>');
                });
            }
        }
});

php:

<?php

 session_start();

include ("../DataLayer/VO/UserVO.php");
include ("../DataLayer/DAO/UserDAO.php");

// Database Execution for User Related Request
$userDAO = new UserDAO();

print_r($_POST);

if(isset($_POST['signIn']))
{
  echo 'test2';

  $user = new UserVO();

  $user->setEmail(trim($_POST['email-signin']));
  $user->setPassword(trim($_POST['pwd-signin']));

  // Request signin
  $userDAO->signIn($user);
}

Using this code, my if(isset($_REQUEST['signIn'])) in my php file never returns true. I have tried multiple things, and nothing seems to work.

PS : I am using Jquery 1.12.4

Also, my print_r($_POST); returns an empty Array.

post the code where is if(isset($_REQUEST['signIn'])) as a start — xYuri
– xYuri, Commented Sep 28, 2016 at 19:59
Can you try pulling up the dev console, and going to the network tab? When you submit the AJAX request, the script that it's POSTing to will show up there. Click on it and you can view the submitted data as well as the response from the server. See what exactly AJAX is sending... — Native Coder
– Native Coder, Commented Sep 28, 2016 at 20:21
See my answer now. Try removing e.preventDefault() and putting return false; at the VERY END of the on click function. also, remove the method from the form (that way the form won't even try to submit, plus you don't need it since you are using AJAX) — Native Coder
– Native Coder, Commented Sep 28, 2016 at 20:36

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

jQuery's serialize function does not encode the values of buttons. Taken from here

NOTE: This answer was originally posted by slashingweapon

jQuery's serialize() is pretty explicit about NOT encoding buttons or submit inputs, because they aren't considered to be "successful controls". This is because the serialize() method has no way of knowing what button (if any!) was clicked.

I managed to get around the problem by catching the button click, serializing the form, and then tacking on the encoded name and value of the clicked button to the result.

$("button.positive").click(function (evt) {
    evt.preventDefault();

    var button = $(evt.target);                 
    var result = button.parents('form').serialize() 
        + '&' 
        + encodeURIComponent(button.attr('name'))
        + '='
        + encodeURIComponent(button.attr('value'))
    ;

    console.log(result);
});

As far as the var dump being empty on the PHP side, try using jQuery's .click instead of the .on event.

$('#signIn').click(function(){});

Also, remove the method from your form. It looks like the form may be submitting as soon as you click the button. Also, remove

e.preventDefault();

and place

return false;

at the VERY END of the on click function. return false does 3 things

e.preventDefault()
e.stopPropigation();
return immdediatly

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Sep 28, 2016 at 20:04

Native Coder

1,8803 gold badges20 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user4705249 Over a year ago

Still no deffierence of results

Native Coder Over a year ago

@Marc-André are you 100% sure that you don't have a FileNotFound error? have you looked at the dev console to make sure that the data is being posted to the file? ("../php/BusinessLayer/User.php")

user4705249 Over a year ago

@NativeCoder I assumed it worked, since I did an echo('test') and I got test written on my error box

Native Coder Over a year ago

Where did you echo test? in the script that is being called via ajax?

Collectives™ on Stack Overflow

php $POST[] empty after Ajax call from jquery

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related