hi.. here is my page.. at the moment the javascript that is written changes the value of a drop down when the radio buttons are pressed.. i have removed the radio buttons and the page now looks like this..
http://www.londonheathrowcars.com/page.htm
i want this script altered so the values load in the textbox when a category has been chosen from the top drop down.. below is the page code..
thank you in advance for any assistance
http://www.londonheathrowcars.com/page.htm
i want this script altered so the values load in the textbox when a category has been chosen from the top drop down.. below is the page code..
thank you in advance for any assistance
Code:
<html>
<head>
<title>Loading list dynamically</title>
<script type="text/javascript">
// an array to hold the contents of all lists
var lists = [
["C1","WC1"],
["C1","WC2"],
["C2","Waterloo"],
["C2","Kings Cross"],
["C3","Hilton Kensington"],
["C3","Ritz Kensington"],
["C4","London Gatwick"],
["C4","London Stansted"],
["C5","Southampton"],
["C5","Portsmouth"],
["C6","Big Ben"],
["C6","Buckingham Palace"],
["C7","Reading"],
["C7","Brighton"],
["C7","Liverpool"],
["C7","Southend"]
];
// onclick handler for radio buttons
function switchList() {
var listId = this.value;
// get rid of current items in list
var list = document.getElementById("theList");
while (list.options.length > 0) {
list.removeChild(list.options[0]);
}
var opt = new Option();
for (var i=0; i < lists.length; i++) {
if (lists[i][0] == listId) {
var opt = new Option();
opt.value = lists[i][1];
opt.text = lists[i][1];
list.options.add(opt);
}
}
}
// add onclick handler to radio buttons
window.onload = function () {
var inps = document.getElementsByTagName("input");
for (var i=0; i < inps.length; i++) {
if (inps[i].type.toLowerCase()== "radio") {
inps[i].onclick = switchList;
}
}
}
</script>
</head>
<body>
<select id="theList" name="A" name="D1" size="1" style="width:150px;">
<option>Please Select..</option>
<option name="chooseList" value="C1">London Postcodes</option>
<option name="chooseList" value="C2">Train Stations</option>
<option name="chooseList" value="C3">Hotels</option>
<option name="chooseList" value="C4">Airports</option>
</select>
<br><br>
<select id="theList" name="A" name="D1" size="6" style="width:150px;">
<option selected="selected" value="Place">..</option>
</select>
</body>
</html>