This must be the most asked question around here, but I have been scratching my head for an hour now and I cannot figure out why my data does not make it to the server side.
My HTML where I have a simple table and my goal is to have all users in the table and for each row there is a link which redirects to another PHP page which should query some data according to the specific username to which the row corresponds to:
<?php
include_once 'includes/psl-config.php';
include_once 'includes/db_connect.php';
include 'includes/functions.php';
?>
<!DOCTYPE html>
<html>
<head>
<title>Individual Data</title>
<script src="js/jquery-2.1.3.min.js"></script>
<script src="js/jquery-ui-1.11.3.min.js"></script>
<script src="js/ind.js"></script>
</head>
<body>
<table id="highscore">
<tr id='title'>
<th></th>
<th>Username</th>
<th>Trials</th>
<th>RDM</th>
</tr>
<?php
$scores = getTopScores($mysqli);
$nr = 1;
foreach($scores as $row){
echo '<tr id="highscore"><td id="id">'.$nr.'.'.'</td><td id="username">'.$row['username'].'</td><td>'.$row['trial'].'</td>'.'<td><a id="irdm" href="individualRDM.php">RDM</a></td></tr>';
$nr+=1;
}
?>
</table>
</body>
</html>
This is my JavaScript where I send the data:
$(window).load(function(){
$('a#irdm').click(function(){
var $item = $(this).closest("tr")
.find("#username")
.text();
$.ajax({
type: 'post',
url: 'individualRDM.php',
data: {
username: "test"
},
success: function( data ) {
console.log( data );
}
});
});
});
This is the PHP file where I would like to see the data:
<?php
include_once 'includes/psl-config.php';
include_once 'includes/db_connect.php';
var_dump($_POST);
if(isset($_POST['username']))
{
$username = $_POST['username'];
print $username;
}
else
{
echo "No username supplied";
}
?>
The problem right now is that $_POST variable is completely empty. I'm sorry if this probably is a duplicate of every other Ajax related question, but I've been through many of them and I still cannot solve it. Some help would be really appreciated.
