Board index   FAQ   Search  
Register  Login
Board index php forum :: HTML JavaScript

Moving data from <select> to <input>

Javascript coding ..

Moderators: macek, egami, gesf

Moving data from <select> to <input>

Postby popeye » Fri Jul 08, 2005 12:40 pm

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
User avatar
popeye
New php-forum User
New php-forum User
 
Posts: 120
Joined: Sat Jan 03, 2004 7:06 pm
Location: New York, NY

Postby gesf » Fri Jul 08, 2005 5:24 pm

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 ?
User avatar
gesf
Moderator
Moderator
 
Posts: 1718
Joined: Sun Dec 29, 2002 5:03 am
Location: Portugal / Sweden

Postby popeye » Fri Jul 08, 2005 6:05 pm

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.
User avatar
popeye
New php-forum User
New php-forum User
 
Posts: 120
Joined: Sat Jan 03, 2004 7:06 pm
Location: New York, NY

Postby gesf » Fri Jul 08, 2005 8:49 pm

Try using the selectedIndex property:
Code: Select all
document.FormName.InputName.value = document.FormName.SelectName.selectedIndex
You can take better advantage over the select options through its option property.
Example:
Code: Select all
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.
User avatar
gesf
Moderator
Moderator
 
Posts: 1718
Joined: Sun Dec 29, 2002 5:03 am
Location: Portugal / Sweden

Postby popeye » Sat Jul 09, 2005 6:11 pm

This is great. I will give it a try and will let you know. An example would be even better.
Thanks a lot. :)
User avatar
popeye
New php-forum User
New php-forum User
 
Posts: 120
Joined: Sat Jan 03, 2004 7:06 pm
Location: New York, NY

Postby popeye » Sat Jul 09, 2005 7:23 pm

I gave it a try and it did not work. It seems that I am missing something. Here are my examples:

Code: Select all
<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: Select all

<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>


:?
User avatar
popeye
New php-forum User
New php-forum User
 
Posts: 120
Joined: Sat Jan 03, 2004 7:06 pm
Location: New York, NY

Postby gesf » Mon Jul 11, 2005 11:54 am

Oh, you'll need to use window opener property in this case.
Try this test2s.html:
Code: Select all
<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.
User avatar
gesf
Moderator
Moderator
 
Posts: 1718
Joined: Sun Dec 29, 2002 5:03 am
Location: Portugal / Sweden

Postby popeye » Mon Jul 11, 2005 7:34 pm

It should work. I will try it.
Thanks again.
User avatar
popeye
New php-forum User
New php-forum User
 
Posts: 120
Joined: Sat Jan 03, 2004 7:06 pm
Location: New York, NY


Return to JavaScript

Who is online

Users browsing this forum: No registered users and 1 guest

Sponsored by Sitebuilder Web hosting and Traduzioni Italiano Rumeno and antispam for cPanel.