Question

Here is my javascript. I am trying to have jQuery send my sign in form data over to my PHP file. I then tell it to grab the data from the php file and display it. But all that is coming back is “null”. If I request another value such as bio, it can display it. But it cant display data sent from my form.

<script type="text/javascript">
    $(document).ready(function() {
        $("img").click(function() {
            var data = $('form#signin').serialize();
            $.ajax({
                url:'signin.php',
                type:'POST',
                data: data,
                success:function(data) {
                    $("p.test").html(data);
                    $.getJSON("signin.php", function(data) {
                        localStorage.email = data[0];

                    });
                },
                error:function(data) {
                }
            });
        });
    });
</script>

Here is my PHP

<?php

$email = $_POST["email"];

$profile = array($email, "Karl", "Clement", "Gangsta Love!", "bio bio bio bio bio bio bio     bio bio bio bio bio bio bio bio bio bio bio", "Ottawa",     "http://a3.twimg.com/profile_images/1459354642/IMG_1560_normal.jpg");

header('Content-Type:text/json');
echo json_encode($profile);

?>

Thank you so much for your help!

Answer 1

getJSON sends a GET-request, but you try to access a POST-variable.(to be exactly you don’t send any variables via $.getJSON )

The $.ajax()-request with a datatype set to ‘json’ should be sufficient:

<script type="text/javascript">
    $(document).ready(function() {
        $("img").click(function() {
            var data = $('form#signin').serialize();
            $.ajax({
                url:'signin.php',
                type:'POST',
                data: data,
                dataType:'json',
                success:function(data) {

                        localStorage.email = data[0];

                },
                error:function(data) {
                }
            });
        });
    });
</script>