Hoi,
Ik heb dit script gevonden op een educatieve site. D.m.v. javascript, ajax en xml probeer ik info uit xml in te laten lezen in de dropdowns.
Lokaal werkt dit prima (alle browsers). Als ik het upload naar de server werkt het wel in Firefox maar niet in Explorer.
In de javascript code wordt wel rekening gehouden met explorer (zie if statement)
Hoe kan ik het script aanpassen zodat het wel werkt? Op het Internet heb ik iets gelezen over de Internet "bug" van Ajax maar waarom werkt het wel lokaal in Explorer maar niet op de server.
Iemand een idee?
HTML:
JAVASCRIPT :
Ik heb dit script gevonden op een educatieve site. D.m.v. javascript, ajax en xml probeer ik info uit xml in te laten lezen in de dropdowns.
Lokaal werkt dit prima (alle browsers). Als ik het upload naar de server werkt het wel in Firefox maar niet in Explorer.
In de javascript code wordt wel rekening gehouden met explorer (zie if statement)
Hoe kan ik het script aanpassen zodat het wel werkt? Op het Internet heb ik iets gelezen over de Internet "bug" van Ajax maar waarom werkt het wel lokaal in Explorer maar niet op de server.
Iemand een idee?
HTML:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script language="javascript" type="text/javascript" src="js.js"></script> </head> <body onload="laadXML();"> <div id="opdstart">Test</div> <!-- <option> added to make xhtml 1.0 valid before using the dropdowns --> <form name="form1" id="form1" action="#"> <select name="dropdown1" id="dropdown1"><option>--- maak een keuze ---</option></select><br /> <select name="dropdown2" id="dropdown2"><option> </option></select><br /> <select name="dropdown3" id="dropdown3"><option> </option></select> </form> </body> </html> |
JAVASCRIPT :
code:
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
| <!--
var cursussen;
var onderdelen;
var titels;
// XMLHttpRequest for internet explorer or other browsers
function nieuwRequest(){
var verzoek;
if (window.XMLHttpRequest) {
verzoek = new XMLHttpRequest();
//alert('not IE');
} else if (window.ActiveXObject) {
//alert('IE');
verzoek = new ActiveXObject("Microsoft.XMLHTTP");
//request = new ActiveXObject("Msxml2.XMLHTTP");
}
return verzoek;
}
// load xml file and load up the first dropdown
function laadXML(){
// make sure the browser supports getElementsByTagName
if(document.getElementsByTagName) {
var verzoek = nieuwRequest();
//if (verzoek) alert('ready')
verzoek.open("GET","dropdown.xml", false) //Mozilla permission denied
//anoniemle functie als eventHandler
verzoek.onreadystatechange = function(){
if (verzoek.readyState==4){
//alert(verzoek.responseText)
firstDrop(verzoek.responseXML.documentElement)
}
}
verzoek.send(null);
}
else { error(); }
}
//********************************************************************
// print error
function error() {
alert("Your browser can\'t handle this script");
}
function removeDrop(dropdown) {
while(dropdown.hasChildNodes()){
dropdown.removeChild(dropdown.lastChild);
}
}
// first option >> "--- maak een keuze ---"
function firstOption(dropdown) {
var eerste = document.createElement("option");
eerste.appendChild(document.createTextNode("--- maak een keuze ---"));
dropdown.appendChild(eerste);
}
// first drop, made when xml document is fully loaded
function firstDrop(root) {
cursussen = root.getElementsByTagName("cursus");
var drop = document.form1.dropdown1;
drop.onchange=function(){ secondDrop() }; // add onchange event
// lus doorheen alle cursus elementen
for (var i=0;i<cursussen.length;i++){
var optie = document.createElement("option");
var inhoud = document.createTextNode(cursussen[i].getAttribute("name"));
optie.appendChild(inhoud);
drop.appendChild(optie);
}
}
// second drop, onchange of first drop
function secondDrop() {
var drop = document.form1.dropdown2;
//alert(document.form1.dropdown1.selectedIndex);
if (document.form1.dropdown1.selectedIndex > 0) { // ignore first option
// verwijder alle vorige opties
removeDrop(drop);
removeDrop(document.form1.dropdown3);
drop.onchange=function(){ thirdDrop() };
firstOption(drop); // add first option
// only select 'onderdeel' from selected 'cursus' in dropdown1
onderdelen = cursussen[document.form1.dropdown1.selectedIndex-1].getElementsByTagName("onderdeel");
for (var i=0;i<onderdelen.length;i++){
var optie = document.createElement("option");
var inhoud = document.createTextNode(onderdelen[i].getAttribute("name"));
optie.appendChild(inhoud);
drop.appendChild(optie);
}
}
}
// third drop, onchange of second drop
function thirdDrop() {
var drop = document.form1.dropdown3;
if (document.form1.dropdown2.selectedIndex > 0) {
removeDrop(drop);
drop.onchange=function(){ goTo() };
firstOption(drop); // eerste optie
// only select 'titel' from selected 'onderdeel' in dropdown2
titels = onderdelen[document.form1.dropdown2.selectedIndex-1].getElementsByTagName("titel");
for (var i=0;i<titels.length;i++){
var optie = document.createElement("option");
var inhoud = document.createTextNode(titels[i].firstChild.nodeValue);
optie.appendChild(inhoud);
drop.appendChild(optie);
}
}
}
// go to url, selected with the third dropdown
function goTo() {
var url = titels[document.form1.dropdown3.selectedIndex-1].getAttribute("url");
window.location.href = url;
}
//--> |
/u/107051/jeroenmadtrix60.png?f=community)
Dit topic is gesloten.