Javascript: how to insert value into text input fields from a drop down menu
I am pretty new to javascript so I hope someone here can help me out with this little task.
I currently have two input text fields that I need to be populated with text after selecting an option from a drop down menu.
For example...
I have a select field that looks like this:
<select id="select_2" onchange="insertProduct(2);">
And within that select I have options that look like this:
<option id="cdrom001" title="my cdrom">cdrom001 - my cdrom</option>
<option id开发者_开发百科="DVD-ABUG" title="A Bug's Life">DVD-ABUG - A Bug's Life</option>
<option id="DVD-BELOVED" title="Beloved">DVD-BELOVED - Beloved</option>
....
What I want to happen, is when I select an option from that drop down list, I want my text input field #1 to be populated with the option id (eg. DVD-ABUG) and I want my text input field #2 to be populated with the option title (eg. A Bug's Life).
Here is the code for my two text input fields:
<input type="text" name="model[]" id="model_2">
<input type="text" name="product[]" id="product_2">
I have this much written of the function that will be required to do this...
function insertProduct(id){
// code goes here
}
As you can see, I don't have much. :o)
Can someone please help me with the function that can do this?
Thanks so much!
Change this line:
<select id="select_2" onchange="insertProduct(2);">
to this:
<select id="select_0" onchange="insertProduct(this, 0);">
and use this function:
function insertProduct(select, row){
var model = "model_";
var product = "product_";
document.getElementById(model + row).value = select.options[select.selectedIndex].id;
document.getElementById(product + row).value = select.options[select.selectedIndex].title;
}
Here is what you are looking for Just call it on onchange
instead of button click
http://www.mredkj.com/tutorials/tutorial002.html
精彩评论