AJAX request not displaying information - php

Question

I am trying to check the entered username and email with the database to check its availability.
It checks the email perfectly fine. I am using the same code for the email but with different id tags:
Here is my form for username:
<label for="username">Desired Username</label>
<input type="text" class="form-control" id="desusername" name="desusername" placeholder="Enter username" onkeyup="checkname();" required>
<span id="name_status"></span>
Here is the function to check it:
function checkname()
{
var username=document.getElementById("desusername").value;
if(username) {
$.ajax({
type: 'post',
url: '../members/authentication/checkusername.php',
data: {
username:username,
},
success: function (response) {
$( '#name_status' ).html(response);
if(response=="OK") {
return true;
}else {
return false;
}
}
});
}
else {
$( '#name_status' ).html("");
return false;
}
}
And here is my php script to check:
<?php
require_once("../../includes/database.class.php");
if(isset($_POST['desusername'])){
$username = $_POST['desusername'];
$sql = "SELECT username FROM users WHERE username = '$username'";
$result = $database->query($sql);
if(mysqli_num_rows($result) > 0) {
?>
<div class="alert alert-danger" role="alert">
<strong>Username already exists</strong>. Please choose a different one.
</div>
<?php
}else{
?>
<div class="alert alert-success" role="alert" style="margin-top: 10px;">
<strong>Valid</strong>. You are good to go!
</div>
<?php
}
exit();
}
?>
Now, in the developers console it shows its calling the function everytime i type:
XHR finished loading: POST "http://localhost/members/authentication/checkusername.php".
But nothing is displaying in the relevant div (#name_status)..

Answer 1

You can't see the response because you're using the wrong index on checkusername.php.
change below code
if(isset($_POST['desusername'])){
$username = $_POST['desusername'];
to this
if(isset($_POST['username'])){
$username = $_POST['username'];
and you're good to go. :)
Make sure that
data: {
key:value,
},
You have to use key while fetching data from post request or get request.