Page 1 of 1

Help with handling forms....

Posted: Thu Dec 19, 2002 1:24 pm
by infolock
I have a question. I have yet to write the code because I'm just wanting a general Idea of how to do this before I even attempt it.


I'm currently creating a page, that I want to update on the fly, and NOT go to another page.

IE, let's say i have a drop down menu. In this drop down, I have Monkey, Zebra, and Lion. On the same page that the drop-down menu is, I have 3 boxes that are blank.

What I want to do, is when I click the drop-down, and select something, like Lion for example, I want the 3 fields to populate with mammal, king, and meat eaters as soon as I select it. I do not, however, want another page to open that has the information on it, just want it all to load on the fly.

Is there an array or xml script that I could use in order to have this done?

Thanks!

Posted: Thu Dec 19, 2002 2:22 pm
by daven
Such things are usually handled with javascript. The following code supposes you have a mysql table "animals" with columns "animal", "taxonomy", "title", and "type". The result is that when you choose an item in the select box, the other fields will be automatically populated. I hope this helps

<script language="javascript">
<!--
<?
$qry_animals="SELECT * FROM animals";
$result=mysql_query($qry_animals, $conn);
while($row=mysql_fetch_assoc($result)){
?>
var animal_array_<?=$animal?> = new Array();
var animal_array_<?=$animal?>[0]=$row['taxonomy'];
var animal_array_<?=$animal?>[1]=$row['title'];
var animal_array_<?=$animal?>[2]=$row['type'];
<?
}
?>

function Populate(){
// Only process the function if the first item ("choose option") is not selected.
if (document.form.animal.selectedIndex != 0){
// get the animal from the select box
var selected_animal = document.form.animal[document.form.animal.selectedIndex].value;
// enter values for text boxes
document.taxonomy.value=eval("animal_array_" + selected_animal + "[0]");
document.title.value=eval("animal_array_" + selected_animal + "[1]");
document.type.value=eval("animal_array_" + selected_animal + "[2]");
}
}
//-->
</script>

<HTML>
<form name="form" action="">
<select name="animal" onchange="Populate()">
<option>Lion<option>Monkey<option>Zebra
</select>
<input type="text" name="taxonomy" value="">
<input type="text" name="title" value="">
<input type="text" name="type" value="">
</form>
</HTML>

Posted: Thu Dec 19, 2002 2:24 pm
by infolock
great, thanks for the info! 8)