How to make a button inside a table execute a mysql query - php

Question

I have a simple html table that displays data from a mysql table containing a list of available tournaments.
<table>
<tr>
<th>Tournament Name</th>
<th>Platform</th>
<th>Date</th>
<th>Venue</th>
<th>Judge</th>
<th>Description</th>
<th>Limit</th>
<th>Register</th>
</tr>
<?php while($row = mysqli_fetch_array($result)):?>
<tr>
<td><?php echo $row['nTournament'];?></td>
<td><?php echo $row['pTournament'];?></td>
<td><?php echo $row['dTournament'];?></td>
<td><?php echo $row['vTournament'];?></td>
<td><?php echo $row['jTournament'];?></td>
<td><?php echo $row['dTournament'];?></td>
<td><?php echo $row['lTournament']; ?></td>
<td><form method="post" action="tournamentlist.php"><button type="submit" name="btn_register"></button></form></td>
</tr>
<?php endwhile; ?>
</table>
What I want to do is that once the current user clicks that button, the button executes a query which takes the current user's id and the tournament id of the selected row to add them to another mysql table. Something like a tournament inscription.
The query/function I want to run is:
if (isset($_POST['btn_register'])) {
singup();
}
function singup() {
global $db;
$idUser = $_POST['idUser'];
$idTournament= $_POST['idTournament'];
$query = "INSERT INTO registeredCompetitor(idUser, idTournament) VALUES ('$idUser', '$idTournament')";
mysqli_query($db, $query);
header('location: tournamentlist.php');
}
The query works just fine on it's own but I don't know if the function itself works because of the button.
Is it possible to do such thing without the use of a form? If not, What other ways are there to do something like this?
EDIT1: Button now is ready but nor the function or the query executes once it's clicked.

Answer 1

You can create a form on each row that has 2 hidden fields in it. Not sure what your DB fields are called though so you'll have to change user_id and tournament_id to something appropriate.
...
<td>
<form action="post" action="the_name_of_your_php_script.php">
<input type="hidden" name="idUser" value="<?php echo $row['user_id']; ?>">
<input type="hidden" name="idTournament" value="<?php echo $row['tournament_id']; ?>">
<button type="submit" name="btn_register"></button>
</form>
</td>
...
Can't wrap it because <form> is not allowed as a child of <td>
All the documentation I see online permits forms inside of <td>. The other alternative is to use a link instead of a form.

Answer 2

You can use javascript to execute this functionality.
<table>
<tr>
<th>Tournament Name</th>
<th>Platform</th>
<th>Date</th>
<th>Venue</th>
<th>Judge</th>
<th>Description</th>
<th>Limit</th>
<th>Register</th>
</tr>
<?php while($row = mysqli_fetch_array($result)):?>
<tr>
<td><?php echo $row['nTournament'];?></td>
<td><?php echo $row['pTournament'];?></td>
<td><?php echo $row['dTournament'];?></td>
<td><?php echo $row['vTournament'];?></td>
<td><?php echo $row['jTournament'];?></td>
<td><?php echo $row['dTournament'];?></td>
<td><?php echo $row['lTournament']; ?></td>
<td><button type="submit" onclick="sendRequest('<?php echo $idUser ?>','<?php echo $idTournament ?>')" name="btn_register"></button></td>
</tr>
<?php endwhile; ?>
</table>
Javascript code
function sendRequest(idUser,idTournament ){
// i am using jquery
$.post(other_page_url,{idUser:idUser,idTournament :idTournament},function(data)
{
window.location = 'tournamentlist.php';
} )}
I hope it's gonna help you

Answer 3

You don't need to wrap this in a <form> inside the table, you can do it all via Javascript / Jquery if you wish. On the html side, add the data you need to the button in data sets:
<td><button type="submit" name="btn_register" id="btn_register" data-user-id="<?php echo $userId ?>" data-tournament-id="<?php echo $row['idTournament']; ?>"></button></td>
Then in your script, you can call the data and send to post via ajax and either load the new page after INSERT, or load as a modal, or whatever you like. You can do something like below if loading a modal (change the load part to refresh the page if you want to go directly):
$('#btn_register').on('click', function () {
var t_id = $(this).data('tournament-id');
var u_id = $(this).data('user-id');
$.ajax({
url: "YourURL",
type: "POST",
data:{
t_id:t_id,
u_id:u_id
},
success: function (h) {
$(".modal-title").text("Table with new stuff");
$(".modal-body").html(h);
$('#modal').modal();
// lots of options here - you could even reload above if desired
}
})
});