her er et bud på hvordan det kunne se ud:
jeg har lavet navnet om på <select name="
class"> til <select name="
classes"> for at undgå problemer med det reseveret ord class (css), samt sat id'er på dine selectboxe
princippert er at jeg sender den valgte værdi over til severen, henter data på baggrund af denne værdi, encoder da i json, og retunerer det til mit script, i scriptet decoder jeg så data, og ligger det ind i en selectbox.
index.html
<?php
require_once("db_conn.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
</style>
<script type="text/javascript">
function UpdateTeam(Val){
var url = "request.php";
var params = "id=" + Val+"&group=team&rand="+Math.random();
var http = new XMLHttpRequest();
http.open("GET", url+"?"+params, true);
http.onreadystatechange = function () {
if(http.readyState == 4 && http.status == 200 ){
js_ar = JSON.parse(http.responseText);
var lng = js_ar.length;
var fragment = document.createDocumentFragment();
var listeelm = document.getElementById("classes");
var select = document.createElement('select');
select.setAttribute("id", "classes");
select.setAttribute("name", "classes");
select.setAttribute("onchange", "UpdatePlayer(this.value)");
var option = document.createElement('option');
var text = document.createTextNode("vælg hold");
option.setAttribute("value", "0");
option.appendChild(text);
select.appendChild(option);
for( var i = 0; i < lng; i++ ) {
option = document.createElement('option');
option.setAttribute("value",js_ar[i]['id']);
text = document.createTextNode(js_ar[i]['name']);
option.appendChild(text);
select.appendChild(option);
}
fragment.appendChild(select);
listeelm.parentNode.replaceChild(fragment, listeelm);
}
}
http.send(null);
UpdatePlayer(0);
}
function UpdatePlayer(Val){
var url = "request.php";
var params = "id=" + Val+"&group=player&rand="+Math.random();
var http = new XMLHttpRequest();
http.open("GET", url+"?"+params, true);
http.onreadystatechange = function () {
if(http.readyState == 4 && http.status == 200 ){
js_ar = JSON.parse(http.responseText);
var lng = js_ar.length;
var fragment = document.createDocumentFragment();
var listeelm = document.getElementById("player");
var select = document.createElement('select');
select.setAttribute("id", "player");
select.setAttribute("name", "player");
var option = document.createElement('option');
var text = document.createTextNode("vælg spiller");
option.setAttribute("value", "0");
option.appendChild(text);
select.appendChild(option);
for( var i = 0; i < lng; i++ ) {
option = document.createElement('option');
option.setAttribute("value",js_ar[i]['id']);
text = document.createTextNode(js_ar[i]['name']);
option.appendChild(text);
select.appendChild(option);
}
fragment.appendChild(select);
listeelm.parentNode.replaceChild(fragment, listeelm);
}
}
http.send(null);
}
</script>
</head>
<body>
<form method="post" action="?page=<?php echo $page;?>" name="enter">
<fieldset>
Vælg turnering:
<select name="tourn" id="tourn" onchange ="UpdateTeam(this.value)">
<option selected="selected" value="">Vælg her</option>
<?php
$sqlT = "select * from tournaments where tournSubscr >= ".date('d-m-Y')."";
$queryT = mysqli_query($db,$sqlT);
while($resT=mysqli_fetch_array($queryT)){
echo"<option value='".$resT['tournID']."'>".$resT['tournName']."</option>";
}
?>
</select><br />
Vælg dit hold:
<select name="classes" id="classes" onchange ="UpdatePlayer(this.value)">
<option selected="selected" value="">Vælg her</option>
</select><br />
Dit navn:
<select name="player" id="player">
<option selected="selected" value="">Vælg her</option>
</select><br />
<input type="submit" name="okT" value="Tilmeld" />
</fieldset>
</form>
</body>
</html>
request.php
<?php
require_once("db_conn.php");
$id = $_GET['id'];
$group = $_GET['group'];
$ar = array();
switch($group){
case "team":
$sql = "select * from classes where tournID = ".$id."";
$query = mysqli_query($db,$sql);
while($res=mysqli_fetch_array($query)){
$ar[] = array("id" => $res['classID'], "name" => $res['className']);
}
break;
case "player":
$sql = "select * from players where classID = ".$id."";
$query = mysqli_query($db,$sql);
while($res=mysqli_fetch_array($query)){
$ar[] = array("id" => $res['playerID'], "name" => $res['playerName']);
}
break;
}
echo json_encode($ar);
?>
db_conn.php
<?php
$db = mysqli_connect('localhost', 'root', '', 'test');
if (!$db) {
die('Connect Error (' . mysqli_connect_errno() . ') '. mysqli_connect_error());
}
mysqli_set_charset($db, "utf8");
?>
fil.sql
CREATE TABLE IF NOT EXISTS `classes` (
`classID` int(11) NOT NULL AUTO_INCREMENT,
`className` text NOT NULL,
`tournID` int(11) NOT NULL,
PRIMARY KEY (`classID`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=5 ;
INSERT INTO `classes` (`classID`, `className`, `tournID`) VALUES
(1, 'kl. 1', 1),
(2, 'kl. 2', 2),
(3, 'kl. 3', 2),
(4, 'kl. 4', 3);
CREATE TABLE IF NOT EXISTS `players` (
`playerID` int(11) NOT NULL AUTO_INCREMENT,
`playerName` text NOT NULL,
`classID` int(11) NOT NULL,
PRIMARY KEY (`playerID`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=7 ;
INSERT INTO `players` (`playerID`, `playerName`, `classID`) VALUES
(1, 'spiller 1', 1),
(2, 'spiller 2', 4),
(3, 'spiller 3', 2),
(4, 'spiller 4', 3),
(5, 'spiller 5', 2),
(6, 'spiller 6', 2);
CREATE TABLE IF NOT EXISTS `tournaments` (
`tournID` int(11) NOT NULL AUTO_INCREMENT,
`tournSubscr` date NOT NULL,
`tournName` text NOT NULL,
PRIMARY KEY (`tournID`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;
INSERT INTO `tournaments` (`tournID`, `tournSubscr`, `tournName`) VALUES
(1, '2011-09-12', 'Golf'),
(2, '2011-09-06', 'poker'),
(3, '2011-09-04', 'svømning');
