Moving data from <select> to <input>

  • Thread starter Thread starter Anonymous
  • Start date Start date
A

Anonymous

Guest
I have a <input> in a form that when I double click on it a second form will open with a select option. I need to populate the input from the first form with the selected item from the second form. Is there a JavaScript routine or technique to help me with this? Thanks
 
Can you be more specific on what you want to do ?
Do you want to fill an input and then after a submittion it will populate a select in another form ?
 
Thanks for the respond.
I have a PHP script that retrieves data from a MySQL table and present them using a bunch of <input> tags. I need to be able to change some of these data by selecting values from a <select> tag. The options of the <select> tag come from a different table which has over 16000 records.
I like the user to be able to change the <input> tag values by double clicking on the <input> area and than I present them with the second form and the <select> options. They will select one of the options and that option should replace the <input> value of the first form.
It all works fine except I can not move the selected option from the second form to the <input> tag from the first form.
 
Try using the selectedIndex property:
Code: 
document.FormName.InputName.value = document.FormName.SelectName.selectedIndex
You can take better advantage over the select options through its option property.
Example:
Code: 
1. SelectName.option[i].selected
2. SelectName.option[i].value
3. SelectName.option[i].name // not sure about name :P

// Where i, is the index of the option. Just like an array
I can't make something now, but will get back soon with a great example if you need.
 
This is great. I will give it a try and will let you know. An example would be even better.
Thanks a lot. :)
 
I gave it a try and it did not work. It seems that I am missing something. Here are my examples:

Code: 
<html>
<head>
<title>test1.html</title>
</head>
<body>
<form name='test1f'  method='POST'>
Change me:<input name='test1i' value='JavaScript'>
<input type="button" value="Click here to Change the Input Value" onclick="window.open('test2s.html')">
</form>
</body>
</html>

and


Code: 
<html>
<head>
<title>test2s.html</title>
<script type="text/javascript">
function changeinputvalue(){
document.test1f.test1i.value = document.test2f.test2s.selectedIndex;
}
</script>
</head>
<body>
<form name="test2f">
<select name="test2s" onChange="changeinputvalue()">
<option>HTML</option>
<option>PHP</option>
<option>MySQL</option>
</select>
<input type='submit' value='Submit'>
</form>
</body>
</html>

:?
 
Oh, you'll need to use window opener property in this case.
Try this test2s.html:
Code: 
<html>
<head>
<title>test2s.html</title>
<script type="text/javascript">
function SetCategory(theForm) {
  if(window.opener && !window.opener.closed) {
  	data = theForm.options[theForm.selectedIndex].value;
    window.opener.document.test1f.test1i.value = data;
    window.close();
  }
}
</script>
</head>
<body>
<form name="test2f" onchange="SetCategory(this)">
<select name="test2s">
<option>HTML</option>
<option>PHP</option>
<option>MySQL</option>
</select>
</form>
</body>
</html>
However i could test it... can't make first file open the 2nd one :p
It should work anyways.
 
You must log in or register to reply here.
Back
Top