I am using PHP to read a CSV file and then constructing a web page with a grid on it showing which classes are being offered when. If there is a class in a particular grid space (say Tuesday morning) it shows the class title and time and provides a button to click to get further details. Each button has an ID which ties in with an array containing the detailed information. For example, the details are contained in $details [button ID][0] – $details [button ID][9]. When I click on the button it provides a (Bootstrap 5) modal popup with the full details. I believe that I need to use AJAX so that when I click on the button onclick will send the button value up to the server and the server will update the page with the button value so that it can be referred to by the modal. I have seen a lot of examples on using AJAX but none of them seem to achieve what I want. Currently I am using

onclick="($.post("index.php", { button: "UpdatedData" }))"

and

<?php echo $details[$_POST["button"]][0] . " " .
$details[$_POST["button"]][3] . " " . $details[$_POST["button"][2]];
?>

in my HTML.

Any pointers would be much appreciated.