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