View Full Version : multiple chain select box
techker
12-15-2008, 03:24 PM
hey guys i want to make a multiple select box mixed with mysql?
cause all the ones i found hade some jquery and ajax in it.
see i need the first box to contain the trainers name and when you select the trainer the second box gets the clients in his databse.is that possible?
maneetpuri
12-26-2008, 09:50 AM
Hi,
Yes this is very much possible with JS or Ajax. The Logic to be implemented will be – there will be one array of the trainers and multiple arrays of clients. There will be one array of clients for each trainer. You will have to trap the onChange event of the trainers multiple select box and call a JS function. This JS function will be passed the value of the trainer clicked, if the trainer is being selected then pick the respective array of clients and populate it in the clients select box and if its being de-selected then remove from the clients select box the clients of the un-selected trainer.
Hope this helps.
Cheers,
~Maneet Puri
jscode
11-01-2009, 09:19 AM
are you looking for something like this?
<script type="text/javascript">
function SelOpt(getID){
var Content = document.getElementById("client");
var sel = Content.getElementsByTagName("select");
Content.reset();
for (var i = 0; i < sel.length; i++){
sel[i].style.display = (sel[i].getAttribute("id") == getID) ? "inline" : "none";
}}
onload = function(){
SelOpt("s0");
}
</script>
<select OnChange="SelOpt(this.value);" OnKeyUp="SelOpt(this.value);">
<option value="s0">select trainer</option>
<option value="s1">trainer 1</option>
<option value="s2">trainer 2</option>
<option value="s3">trainer 3</option>
<option value="s4">trainer 4</option>
</select>
<form Id="client">
<span id="s0"> </span>
<select id="s1">
<option selected>select 1 client 1</option>
<option>select 1 client 2</option>
<option>select 1 client 3</option>
</select>
<select id="s2">
<option selected>select 2 client 1</option>
<option>select 2 client 2</option>
<option>select 2 client 3</option>
</select>
<select id="s3">
<option selected>select 3 client 1</option>
<option>select 3 client 2</option>
<option>select 3 client 3</option>
</select>
<select id="s4">
<option selected>select 4 client 1</option>
<option>select 4 client 2</option>
<option>select 4 client 3</option>
</select>
</form>
techker
11-01-2009, 11:40 AM
exactly.thats cool.i think do there is a mistake cause it stops at the second box.
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.