l104/H16/ajax/leerlingenreservering.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.label {
display: inline-block;
padding: 5px;
width: 100px;
text-align: right;
}
table tr th, table tr td {
padding: 5px;
}
</style>
<script src="../../js/ajax.js"></script>
<script>
onload = setEvents
var llnr, boeknr;
function setEvents(){
document.getElementById('llnr').onchange = llnrChange;
document.getElementById('boeknr').onchange = boeknrChange;
document.getElementById('knopje').onclick = reservering;
window.reservering = reservering;
}
function boeknrChange(){
boeknr =this.options[this.selectedIndex].value;
if (llnr){
llnrChange();
}
}
function llnrChange(){
llnr =this.options[this.selectedIndex].value;
ajax('reservering.php?llnr=' + llnr,'reserveringen');
}
function reservering(){
ajax('reservering.php?llnr=' + llnr + '&boeknr=' + boeknr,'reserveringen');
}
</script>
</head>
<body>
<?php
include('../../db.php');
$queryll = 'select * from leerlingen';
$resultll = mysqli_query($db, $queryll) or die(mysqli_error($db));
$querybk = 'select * from boeken b, auteurs a where a.auteurnr=b.auteurnr';
$resultbk = mysqli_query($db, $querybk) or die(mysqli_error($db));
echo '<div><span class="label">Leerlingen:</span><select name="llnr" id="llnr">';
echo "<option></option>";
while($row = mysqli_fetch_array($resultll)){
echo "<option value=$row[llnr]>$row[voornaam] $row[tussenvoegsel] $row[achternaam]</option>";
}
echo '</select>';
echo '<div><span class="label">Boeken:</span><select name="boeknr" id="boeknr">';
echo "<option></option>";
while($row = mysqli_fetch_array($resultbk)){
echo "<option value=$row[boeknr]>$row[titel] - $row[voornaam] $row[tussenvoegsel] $row[achternaam]</option>";
}
echo '</select>';
echo '<div><button id="knopje" value="Reserveer">Reserveer</button></div>';
echo "<div id='reserveringen'></div>";
echo "<br>
<br>
<br>
<h3 style='text-align: center;'>AJAX OUTPUT</h3>";
echo "<div id='ajaxtext'></div>";
?>
</body>
</html>
Resultaat
Made by Thijs Aarnoudse