By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,600 Members | 1,861 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,600 IT Pros & Developers. It's quick & easy.

Javascript invalid character issue

P: 4
Hello,

Sorta new with JavaScript... so don't kill me with jargon.

I am trying to make a script that will only allow text to be inputted into a textarea that is from a drop down menu. My problem is the textarea/textbox id is pre-set and unchangeable by the shopping cart system I use. (*Changing it will make it un-upgradeable in the future)

Here is what I have so far:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>Dropdown to Textbox</title>
  4. <script type="text/javascript">
  5. function setName(child)
  6. {
  7.  
  8.      document.all.attrib-1-0.value = child.options[child.selectedIndex].text;
  9.  
  10. }
  11. </script>
  12. </head>
  13. <body>
  14.  
  15. <select name="name" onchange="setName(this)">
  16. <option value="001">AJ</option>
  17. <option value="002">Andrew</option>
  18. <option value="003">Andy</option>
  19. </select>
  20.  
  21. <input type="text" name="id[txt_1]" size="32" maxlength="32" value="" id="attrib-1-0" />
  22.  
  23. </body>
  24. </html>
If you replace "attrib-1-0.value" with "foo" in both the script and the text field you will see a working version of the code. It's the invalid characters that mess it up. Now, I have tried to comment the invalid characters out with "/" but it didn't work.

Any suggestions?
Jul 7 '08 #1
Share this Question
Share on Google+
6 Replies


acoder
Expert Mod 15k+
P: 16,027
Firstly, change document.all to document.getElementById. For the ID, use a string:
Expand|Select|Wrap|Line Numbers
  1. document.getElementById("attrib-1-0")...
Jul 7 '08 #2

P: 4
ok...

That suggestion helped me with another issue I was having: (using the getElementById)

Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2. function notEmpty(){
  3.     var myTextField = document.getElementById('attrib-1-0');
  4.     if(myTextField.value != "")
  5.         alert("You entered: " + myTextField.value)
  6.     else
  7.         alert("Please select child's name from dropdown menu")        
  8. }
  9. </script>
however, I still can't get the selected option to go into the textbox using the getElementById

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>Dropdown Option To Textbox</title>
  4.  
  5. <script type="text/javascript">
  6. function notEmpty(){
  7.     var myTextField = document.getElementById('attrib-1-0');
  8.     if(myTextField.value != "")
  9.         alert("You entered: " + myTextField.value)
  10.     else
  11.         alert("Please select child's name from dropdown menu")        
  12. }
  13. </script>
  14.  
  15. <script type="text/javascript">
  16. function setName(child)
  17. {
  18.  
  19.      document.getElementById.("attrib-1-0") = child.options[child.selectedIndex].text;
  20.  
  21. }
  22. </script>
  23. </head>
  24. <body>
  25.  
  26. <select name="name" onchange="setName(this)">
  27. <option value="001">AJ</option>
  28. <option value="002">Andrew</option>
  29. <option value="003">Andy</option>
  30. </select>
  31.  
  32. <input type="text" name="id[txt_1]" size="32" maxlength="32" value="" id="attrib-1-0" />
  33.  
  34. <input type='button' onclick='notEmpty()' value='Submit' />
  35.  
  36. </body>
  37. </html>
Jul 7 '08 #3

acoder
Expert Mod 15k+
P: 16,027
You're not using it correctly. Look how you used it in the notEmpty() function.
Expand|Select|Wrap|Line Numbers
  1. document.getElementById("attrib-1-0").value = child.options[child.selectedIndex].text;
Jul 7 '08 #4

P: 4
I also just remembered to put a readonly on the text box as well. Hopefully this will stop folks from ordering the wrong child's names.

Originally I had a drop down menu of child's names then the customer had to input the data into the correct text box. It became a nightmare..

Thanks again!
Jul 7 '08 #5

P: 4
I used your readOnly script found here:

http://www.w3schools.com/htmldom/prop_text_readonly.asp

You're the best!
Jul 8 '08 #6

acoder
Expert Mod 15k+
P: 16,027
If you needed the value instead of the names, you could replace ".text" with ".value" or even document.getElementById("attrib-1-0").value.

Just a point to bear in mind: client-side error checking is not enough, it's only a convenience. Someone could modify or turn off JavaScript. The real checking should take place on the server-side. You may already have done, but thought I'd just make sure.

Oh, and I'm glad to see that you're happy with the service! ;)
Jul 8 '08 #7

Post your reply

Sign in to post your reply or Sign up for a free account.