Auto Populate HTML Form textbox after selecting an item from my html listmenu

waltg72 · **Posted:** Sun Aug 29, 2010 7:14 pm

Hello Guys,

I am developing a project particularly in enrollment system using php and mysql.

I would like to know if it is possible to produce a auto populated textbox of my html form after selecting
an item from my listbox with php?

Example:

MYSQL Table

Fields

Lastname
Firstname

Sample Data 1
Armstrong
Toby

Sample Data 2
Jimenez
Joy

HTML FORM

<form id="form1" name="form1" method="post" action="">
Lastname
<label>
<select name="select">
</select>
</label>
Firstname
<label>
<input type="text" name="textfield" />
</label>
</form>

What I want to do is, I want to auto populate the firstname textbox based from the selected lastname,
without using the submit button. Meaning, once I click the listbox and choose a lastname. The firstname
with that lastname will display automatically to my firstname textbox based from mysql database.

thanks in advance.

Bored · **Posted:** Thu Sep 09, 2010 6:27 pm

You're going to need to use some javascript here. Look into HTML DOM Event Objects, specifically the onchange event.

waltg72 · **Posted:** Thu Sep 09, 2010 7:46 pm

I believe onchange() will execute the function in javascript once I choose an item from my dropdown list, or let say listmenu.

My next question is, How will I pass the value to my textbox?

Here is my html form source:

<html>
<body>
<form id="form1" name="form1" method="post" action="">
<label>
<select name="select">
<option value="A">Option 1</option>
<option value="B">Option 2</option>
<option value="C">Option 3</option>
<option value="D">Option 4</option>
</select>
</label>
<label>
<input type="text" name="textfield" />
</label>
</form>
</body>
</html>

---------------------------------------------------------------
Question:
1. How will I pass the value that I choose from my list/menu to my textfield?

Zren · **Posted:** Thu Sep 09, 2010 8:22 pm

code:

document.form1.textfield.value = document.form1.select[document.form1.select.selectedIndex].value

.value is the property of the text in the textfield or it is the value inside the option. Alternatively, .text is the property of the text viewable to select from for the option.
select[] is the array of options in the selection dropdown.
select.selectedIndex is the option currently selected.

	Computer Science Canada Programming C, C++, Java, PHP, Ruby, Turing, VB Username: Password: Register
Wiki Blog Search Turing Chat Room Members