how to do i get returned data from ajax call

Question

I am getting a undefined on the username from $sql which should be the returned data from the query.

$('#userlist').on('change', function () {
var selected = $("select option:selected").text();
console.log(selected);
// use ajax to run the check
$.ajax({
    url: '/php/connect/userdropdowncheck.php',
    type: 'JSON',
    data: selected,
    success: formfill,
    error: function (xhr, status, err) { console.log(xhr, status, err); }
});

function formfill(sql) {
    var username = sql['UserLogin'];
    var email = sql['UserEmail'];
    var admin = sql['admin'];
    var firstname = sql['firstname'];
    var lastname = sql['lastname'];
    var title = sql['title'];
    var company = sql['company'];

    console.log(username);

    if (username.length > 0) {
        console.log('Found user');
        console.log(username);
        $('#username').html($username);
    }
    else {
        console.log('Failed to find user');
    }
}

});

PHP code:

<?php

session_start();
include 'anonconnect.php';

// username and password sent from form 
$myusername= $_POST['selected'];  

$sql = $dbh->prepare("SELECT * FROM Users WHERE UserLogin= :login");
$sql->execute(array(':login' => $myusername));
$user = $sql->fetch();

/*** close the database connection ***/
$dbh = null;

if($user->rowCount() == 1){
    echo 1;
     echo json_decode($user);
else {
    echo 0;
}
?>

It is pulling the text from the selected drop down just fine and passing it but the function on the return cannot find it.

Answer 1

your jquery code could be:

function formfill(sql) {
    var username = sql['UserLogin'];
    var email = sql['UserEmail'];
    var admin = sql['admin'];
    var firstname = sql['firstname'];
    var lastname = sql['lastname'];
    var title = sql['title'];
    var company = sql['company'];

    console.log(username);

    if (username.length > 0) {
        console.log('Found user');
        console.log(username);
        $('#username').html($username);
    }
    else {
        console.log('Failed to find user');
    }
}

$('#userlist').on('change', function () {
var selected = $("select option:selected").text();
$.ajax({
    url: '/php/connect/userdropdowncheck.php',
    type: 'POST',
    data: {UserLogin:selected},
    success: function(data){
        formfill(data)
    },
    error: function (xhr, status, err) { console.log(xhr, status, err); }
});

});

and your php code:

<?php

session_start();
include 'anonconnect.php';

// username and password sent from form 
$myusername= $_POST['UserLogin'];  

$sql = $dbh->prepare("SELECT * FROM Users WHERE UserLogin= :login");
$sql->execute(array(':login' => $myusername));
$user = $sql->fetch();

/*** close the database connection ***/
$dbh = null;

if($sql->rowCount() == 1){
    //echo 1; //if you echo this it will cause that your jquery code will not be able to read the response as JSON and serialize it in array
     echo json_encode($user); // php array to json object
} else {
    echo 0;
}
?>

Answer 2

If you using JSON type, you can serialize your javascript array and then pass to php.

Ex: var jsonString = JSON.stringify(Array);

In php, use json_decode() and json_encode()

Ex: $data = json_encode($sql)