-Karl- Posted April 19, 2010 Share Posted April 19, 2010 Okay so I have my select box: <select style="width: 200px; vertical-align: top; height: 143px;" id="background" name="members" size="7" onchange="changeEditMember(this)"> <option value='option1'>option1</option> </select> And my Javascript <script type=\"text/javascript\"> function changeEditMember(membername) { var input_user = document.getElementById('input'); input_user.src = ' + membername + '; } </script> Then finally my input box <input type="text" id="sample"> What the script does, is I populate the select box from a database, and upon clicking an option, it will update the input box with the data from the select box. However, it's not funcitoning properly. I've managed to get the population of the select box to work, however, the input box remains unchanged. I'm quite new to Javascript, so I've probably done it wrong. Any help is greatly appreciated. Quote Link to comment Share on other sites More sharing options...
Psycho Posted April 19, 2010 Share Posted April 19, 2010 I don't see what the purpose is. If the user selects a value in the select list - use that value. I see no need to populate a text field. But, maybe there is some reason you are not sharing. A few problems. 1. "var input_user = document.getElementById('input');", the id of the text field is "sample" not "input" 2. "input_user.src", field objects do not have a src attribute. You want to set the "value" 3. input_user.src = ' + membername + '. If that worked, it would set the value to literally ' + membername + '. The quote marks tell the JS parser that it is a literal string. 4. You pass the select field OBJECT to the function and then attempt to set the value of the text field to that object. You need to get the VALUE of the select object In the code below, the function is modified as well as the onchange trigger event in the select field. <html> <head> <script type="text/javascript"> function changeEditMember(selObj, textID) { document.getElementById(textID).value = selObj.options[selObj.selectedIndex].value; return; } </script> </head> <body> <select style="width: 200px; vertical-align: top; height: 143px;" id="background" name="members" size="7" onchange="changeEditMember(this, 'sample')"> <option value="option1">option1</option> <option value="option2">option2</option> <option value="option3">option3</option> </select> <br /> Text field: <input type="text" id="sample"><br /> </body> </html> Quote Link to comment Share on other sites More sharing options...
-Karl- Posted April 19, 2010 Author Share Posted April 19, 2010 The purpose is because the input box will be used to edit the selected member from the select box. Code works perfectly, thanks a lot! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.