Tijden veranderen
Dropdown menu met detail pagina in AJAX
In de dropdown menu's kun je kiezen voor Werelddeel waarna het 2e dorpdownmenu verschijnt waarin je een Land kan kiezen.
Als het land is gekozen zul je informatie krijgen over het desbetreffende land.
Wat ik tot nu toe heb:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
index.html
<html>
<head>
<script>
function showdeel(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","uitvoer.php?Landnaam="+str,true);
xmlhttp.send();
}
////////////////////////
function showland(str)
{
if (str=="")
{
document.getElementById("selectje").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("selectje").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","uitvoer1.php?Werelddeel="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form id="landen">
<select name="users" onChange="showdeel(this.value)">
<option value="">Select a person:</option>
<option value="Afrika">Afrika</option>
<option value="Europa">Europa</option>
<option value="ZuidAmerika">ZuidAmerika</option>
<option value="NoordAmerika">NoordAmerika</option>
</select>
</form>
<br>
<div id="selectje">Kies het land</div>
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
uitvoer.php:
<?php
$Landnaam=$_GET["Landnaam"];
$con = mysql_connect('127.0.0.1', '68058', 'npx3bk');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("db68058", $con);
$sql="SELECT * FROM landen WHERE Werelddeel = '".$Landnaam."'";
$result = mysql_query($sql);
echo "<table border='1'>
<tr>
<th>Landnaam</th>
<th>Hoofdstad</th>
<th>Inwoners</th>
<th>Oppervlakte</th>
<th>Vlag</th>
<th>Werelddeel</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['Landnaam'] . "</td>";
echo "<td>" . $row['Hoofdstad'] . "</td>";
echo "<td>" . $row['Inwoners'] . "</td>";
echo "<td>" . $row['Oppervlakte'] . "</td>";
echo "<td>" . $row['Vlag'] . "</td>";
echo "<td>" . $row['Werelddeel'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>
[size=xsmall][i]Toevoeging op 03/04/2013 16:19:47:[/i][/size]
Code tags werken niet goed dus het lijkt alsof het 1 bestand is, maar uitvoer is een ander bestand.
<html>
<head>
<script>
function showdeel(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","uitvoer.php?Landnaam="+str,true);
xmlhttp.send();
}
////////////////////////
function showland(str)
{
if (str=="")
{
document.getElementById("selectje").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("selectje").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","uitvoer1.php?Werelddeel="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form id="landen">
<select name="users" onChange="showdeel(this.value)">
<option value="">Select a person:</option>
<option value="Afrika">Afrika</option>
<option value="Europa">Europa</option>
<option value="ZuidAmerika">ZuidAmerika</option>
<option value="NoordAmerika">NoordAmerika</option>
</select>
</form>
<br>
<div id="selectje">Kies het land</div>
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
uitvoer.php:
<?php
$Landnaam=$_GET["Landnaam"];
$con = mysql_connect('127.0.0.1', '68058', 'npx3bk');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("db68058", $con);
$sql="SELECT * FROM landen WHERE Werelddeel = '".$Landnaam."'";
$result = mysql_query($sql);
echo "<table border='1'>
<tr>
<th>Landnaam</th>
<th>Hoofdstad</th>
<th>Inwoners</th>
<th>Oppervlakte</th>
<th>Vlag</th>
<th>Werelddeel</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['Landnaam'] . "</td>";
echo "<td>" . $row['Hoofdstad'] . "</td>";
echo "<td>" . $row['Inwoners'] . "</td>";
echo "<td>" . $row['Oppervlakte'] . "</td>";
echo "<td>" . $row['Vlag'] . "</td>";
echo "<td>" . $row['Werelddeel'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>
[size=xsmall][i]Toevoeging op 03/04/2013 16:19:47:[/i][/size]
Code tags werken niet goed dus het lijkt alsof het 1 bestand is, maar uitvoer is een ander bestand.
Gewijzigd op 03/04/2013 16:19:23 door Snelle Jaap
2) heb je een voorbeeldt
tip: overstappen naar mysqli (mysql zal bij een volgende update vervallen)
SQL hack mogelijk
".$Landnaam." lijn 12
http://68058.ict-lab.nl/MEOI1/opdracht4/opdracht4.html
Heb wat code van w3schools gehaald vandaar dat er nog wat engels tussen staat.
Snelle Jaap op 03/04/2013 17:05:29:
Voorbeeld:
http://68058.ict-lab.nl/MEOI1/opdracht4/opdracht4.html
Heb wat code van w3schools gehaald vandaar dat er nog wat engels tussen staat.
http://68058.ict-lab.nl/MEOI1/opdracht4/opdracht4.html
Heb wat code van w3schools gehaald vandaar dat er nog wat engels tussen staat.
Haha mooi mooi. De testomgeving van het ICT-LAB op het Grafisch Lyceum Rotterdam.
Doe maar de groeten aan Dhr. Kouters van mij ;)
Hij weet 100% zeker wie ik ben.
En gebruik de jquery functie van AJAX, deze XMLrequest shit is zoo out of date. Met jquery is het veel gemakkelijker.
