Edit Records and Display them in form input fields PHP

I’m trying to create a program that displays records from the database and if the users want to edit the record they will just click the edit button and the records from the database will be displayed in their corresponding form input field.

So far here’s my HTML Code:

<!—————–TABLE———————>
<div class=”container”>
<div class=”input-group mb-3″>
<input type=”text” name=”search” class=”form-control” placeholder=”Search Products”>
<button class=”btn btn-success” style=”width: 15vh;” type=”submit” id=”button-addon2″>Search</button>
</div>
<div class=”card”>
<div class=”card-body”>
<?php
$connection = mysqli_connect(“localhost”,”root”,””);
$db = mysqli_select_db($connection, ‘orginal_burger’);

$query = “SELECT * FROM admin”;
$query_run = mysqli_query($connection, $query);
?>
<table id=”datatableid” class=”table table-hover”>
<thead>
<tr>
<th scope=”col”>AID</th>
<th scope=”col”>Firstname</th>
<th scope=”col”>Lastname</th>
<th scope=”col”>Birthdate</th>
<th scope=”col”>Email</th>
<th scope=”col”>Address</th>
<th scope=”col”>Date Created</th>
<th scope=”col”>Action</th>
</tr>
</thead>
<?php
if($query_run)
{
foreach($query_run as $row)
{
?>
<tbody>
<tr>
<td> <?php echo $row[‘aid’]; ?> </td>
<td> <?php echo $row[‘firstname’]; ?> </td>
<td> <?php echo $row[‘lastname’]; ?> </td>
<td> <?php echo $row[‘birthdate’]; ?> </td>
<td> <?php echo $row[’email’]; ?> </td>
<td> <?php echo $row[‘address’]; ?> </td>
<td> <?php echo $row[‘date_created’]; ?> </td>
<td>
<button type=”button” class=”btn btn-success editbtn”><i class=’bx bx-edit-alt’ ></i></button>
<button type=”button” class=”btn btn-danger deletebtn”><i class=’bx bx-trash’ ></i></button>
</td>
</tr>
</tbody>
<?php
}
}
else
{
echo “No Record Found”;
}
?>
</table>
</div>
</div>
<div class=”card-body”>
<p style=”text-align:right;”><button type=”button” class=”btn btn-primary” data-toggle=”modal” data-target=”#studentaddmodal”>Add Admin</button></p>
</div>
</div>
</section>

<!—————————EDIT MODAL———————–>
<div class=”modal fade” id=”editmodal” tabindex=”-1″ role=”dialog” aria-labelledby=”exampleModalLabel” aria-hidden=”true”>
<div class=”modal-dialog” role=”document”>
<div class=”modal-content”>
<div class=”modal-header”>
<h5 class=”modal-title” id=”exampleModalLabel”>UPDATE ADMIN RECORD</h5>
</div>
<form action=”updatecode_admin.php” method=”POST”>
<div class=”modal-body”>
<input type=”hidden” name=”update_aid” id=”update_aid”>
<div class=”form-group”>
<div class = “row”>
<div class = “col mb-12″>
<label>First Name</label>
<input type=”text” name=”firstname” id=”firstname” class=”form-control” readonly>
</div>
<div class = “col mb-12″>
<label>Lastname</label>
<input type=”text” name=”lastname” id=”lastname” class=”form-control” required>
</div>
</div>
</div>
<div class=”form-group”>
<label>Birthdate</label>
<input type=”text” name=”birthdate” id=”birthdate” class=”form-control” readonly>
</div>
<div class=”form-group”>
<label>Email</label>
<input type=”text” name=”email” id=”email” class=”form-control” readonly>
</div>
<div class=”form-group”>
<label>Address</label>
<input type=”text” name=”address” id=”address” class=”form-control” required>
</div>
</div>
<div class=”modal-footer”>
<button type=”button” class=”btn btn-secondary” data-dismiss=”modal”>Close</button>
<button type=”submit” name=”updatedata” class=”btn btn-primary”>Update Admin</button>
</div>
</form>
</div>
</div>
</div>

Here’s my PHP Code:

<?PHP
$server = “localhost:3306”;
$user = “root”;
$pass = “”;

$conn = mysqli_connect($server, $user, $pass);
mysqli_select_db($conn, “orginal_burger”);

if(isset($_POST[‘updatedata’]))
{
$pid = $_POST[‘update_aid’];

$firstname = $_POST[‘firstname’];
$lastname = $_POST[‘lastname’];
$birthdate = $_POST[‘birthdate’];
$email = $_POST[’email’];
$address = $_POST[‘address’];

$query = “UPDATE `admin` SET `firstname`=’firstname’,`lastname`=’$lastname’,`birthdate`=’$birthdate’,`email`=’$email’,`address`=’$address’ WHERE aid =$aid”;
$query_run = mysqli_query($conn, $query);
if($query_run)
{
echo ‘<script> alert(“Admin Updated”); </script>’;
header(“Location:Admin_Product.php”);
}
else
{
echo ‘<script> alert(“Data Not Updated”); </script>’;
}
}
?>

And Here’s my script:

<script>
$(document).ready(function () {

$(‘.editbtn’).on(‘click’, function () {

$(‘#editmodal’).modal(‘show’);

$tr = $(this).closest(‘tr’);

var data = $tr.children(“td”).map(function () {
return $(this).text();
}).get();

console.log(data);

$(‘#update_aid’).val(data[0]);
$(‘#firstname’).val(data[1]);
$(‘#lastname’).val(data[2]);
$(‘#birthdate’).val(data[3]);
$(‘#email’).val(data[4]);
$(‘#address’).val(data[5]);
});
});
</script>

If the users clicked the edit button records from the database will display in their corresponding form input field. How do I set records in form input fields? Thank you