How to make onchange cascade other selections

[john woo]

Hi

if there are 3 selections, named location,department,employee, the
relationshipe is, in a location there are departments, in a department
there are employees, so for a selected location, there should be a set
of associated departments each of which there should be a set of
employees.

I have an example, but only for 2 selections, like

<form name="location">
<select name="location_category"
onChange="swap
(window.document.the_form.locaiton_category.
options[selectedIndex].text);">
<option selected>...<option>...
<option>...
</select>

<select name="department" multiple>
<option>...
<option>...
<option>...
</select>
</form>

function swap(array)
{
var numbers_select = window.document.the_form;
var the_array = eval(array);
setOptionText(window.document.the_form.location, array);
}

Can any one provide me with workable example

 

[Tim Streater]

Hi

if there are 3 selections, named location,department,employee, the
relationshipe is, in a location there are departments, in a department
there are employees, so for a selected location, there should be a set
of associated departments each of which there should be a set of
employees.

I have an example, but only for 2 selections, like

<form name="location">
<select name="location_category"
onChange="swap
(window.document.the_form.locaiton_category.
options[selectedIndex].text);">
<option selected>...<option>...
<option>...
</select>

<select name="department" multiple>
<option>...
<option>...
<option>...
</select>
</form>

function swap(array)
{
var numbers_select = window.document.the_form;
var the_array = eval(array);
setOptionText(window.document.the_form.location, array);
}

Where do you keep all your information? Here, I keep it in a mysql
database (in our case its project, location, equipment, card) and use a
set of iframes. When the user changes project in the project popup, the
onchange loads all the iframes, passing the project code to the location
iframe, and zero to the others. The php code for each iframe then does
this: if given zero, create an empty popup, otherwise read the database
and create a popup of all <subitems> for that <item> (so, all locations
for a project, or all cards for given equipment). You only load the
iframes "below" in the hierarchy, in the onchange.

I used to do it by having a giant matrix of all combinations downloaded,
but this obviously doesn't scale - the matrix was O(n**4) rather than
being linear.

Because iframes are, as far as I can tell, unbounded, you have to
constrain them within a table cell, or possibly some other method:

<td valign=top>
<iframe name="Frame3b" src="fr-cards.phtml?param=0&param2=0"
frameborder=no width=200 height=22 scrolling=no align=top
marginHeight=0></iframe>
</td>

The onchange that gets Frame3b loaded is like:



function setFrmSrc (frame, url, value)
{

var localUrl;

localUrl = url + "?param=" + value + "&param2=0";

frame.location.href = localUrl;

}


function projectSetFrames (objPtr)
{

var value = objPtr.options[objPtr.selectedIndex].value;

setFrmSrc (window.frames["Frame1"], "fr-pops.phtml", value);

setFrmSrc (window.frames["Frame2a"], "fr-equipment.phtml", 0);
setFrmSrc (window.frames["Frame2b"], "fr-equipment.phtml", 0);

setFrmSrc (window.frames["Frame3a"], "fr-cards.phtml", 0);
setFrmSrc (window.frames["Frame3b"], "fr-cards.phtml", 0);

}

Each of the fr-xxxx.phtml files has php code to generate the popup
contents. I also use the second parameter to these (systematically set
to zero in the above code) to indicate which popup element should be set
to "selected".

So my stuff is a mixture of php and Javascript.

-- tim

 

[john woo]

Thanks lots, Tim & Danny.

I appreciated the info. particular Danny's one ( I just don't know php,
so the simpler the best).

Can you explain in

getList(this,this.form.belowList)

what's the first "this" for? is it an object representative in
javascript? like this.document?

 

[Mick White]

Thanks lots, Tim & Danny.

I appreciated the info. particular Danny's one ( I just don't know php,
so the simpler the best).

Can you explain in

getList(this,this.form.belowList)

what's the first "this" for? is it an object representative in
javascript? like this.document?

<select name="foo" onchange="getList(this,this.form.belowList)">

"this" is the list/menu named "foo".

Mick