Wat is er fout aan?
<body>
<h1>Using Ajax and XML</h1>
<form>
<select size="1" id="optionList" onchange="setOption()">
<option>Select a scheme</option>
</select>
<input type = "button" value = "Use color scheme 1" onclick = "getOptions1()">
<input type = "button" value = "Use color scheme 2" onclick = "getOptions2()">
</form>
<div id="targetDiv" width=100 height=100>Color this text.</div>
</body>
<script language="javascript">
var options;
function getOptions1()
{
if(XMLHttpRequestObject){
XMLHttpRequestObject.open("GET","options1.php", true);
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200){
var xmlDocument = XMLHttpRequestObject.responseXML;
options = XMLDocument.getElementsByTagName("option");
listOptions();
}
}
XMLHttpRequestObject.send(null);
}
}
function listOptions()
{
var loopIndex;
var selectControl = document.getElementById('optionList');
for(loopIndex = 0; loopIndex < options.lenght; loopIndex++)
{
selectControl.options[loopIndex] = new
Option(optiions[loopIndex].firstChild.data);
}
}
function setOption()
{
document.getElementById('targetDiv').style.color = options[document.getElementById('optionList').selectedIndex].firstChild.data;
}
</script>
////////////////////
options1.php
////////////////////
<?php
header("Content-type: text/xml");
$options = array('red', 'green', 'blue');
echo '<?xml version="1.0"?>';
echo '<options>';
foreach ($options as $value)
{
echo '<option>';
echo $value;
echo '</option>';
}
echo '</options>';
?>
en options2 is gwn met andere kleuren.
Maar wat is er nu fout aan het options.html?