469,908 Members | 2,213 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,908 developers. It's quick & easy.

how to get selected item or value of html-combo box through javascript?

nirmalsingh
218 100+
i have a combo box with id="combo1", i want to get the selected item or value through javascript. help me plz...
Dec 30 '06 #1
9 157057
I don't know what you want to get the value with but here is an example with a button:


Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <script language="javascript">
  4. function combofunction(the_value){
  5.  
  6. // actions that you want to perform
  7.  
  8. }
  9. </script>
  10. </head>
  11. <body>
  12. <select name="htmlcombo">
  13.     <option name="box1" value="Value1">Display Text1</option>
  14.     <option name="box2" value="Value2">Display Text2</option>
  15.     <option name="box3" value="Value3">Display Text3</option>
  16. </select>
  17. <input type="button" name="combovalue" value="Get Combo Value" onclick="combofunction(htmlcombo.value)">
  18. </body>
  19. </html>
Jan 1 '07 #2
acoder
16,027 Expert Mod 8TB
i have a combo box with id="combo1", i want to get the selected item or value through javascript. help me plz...
Use the following code:
Expand|Select|Wrap|Line Numbers
  1. var combo1 = document.getElementById("combo1");
  2. var val = combo1.options[combo1.selectedIndex].text
If you have the form name, use that instead of getElementById.
Jan 1 '07 #3
ronverdonk
4,258 Expert 4TB
i have a combo box with id="combo1", i want to get the selected item or value through javascript. help me plz...
Easiest way is the following where your JS routine is triggered when you select an item from the drop down box. No need for a submit button.
Expand|Select|Wrap|Line Numbers
  1. function getCombo1(sel) {
  2.   var value = sel.options[sel.selectedIndex].value;  
  3. }
  4. <select id="combo1" onchange="getCombo1(this)">
  5. <option value="">Select combo</option>
  6. <option value="Value1">Text1</option>
  7. <option value="Value2">Text2</option>
  8. <option value="Value3">Text3</option>
  9. </select>
Ronald :cool:
Jan 1 '07 #4
mukeshrasm
254 100+
@acoder
I have modified this code like this
Expand|Select|Wrap|Line Numbers
  1. <input type="button" onclick="change(selectname.options[selectname.selectedIndex].value)"
  2.  
and passing to the click event of button. code works fine in IE but this does not work in Firefox Mozilla.
Jun 30 '09 #5
acoder
16,027 Expert Mod 8TB
That's because selectname will be undefined. IE is wrong here. You need to either define selectname, or write it out in full twice.
Jun 30 '09 #6
acoder
16,027 Expert Mod 8TB
@acoder
I did type this on January the 1st, 2007, but now I'd say that you should use document.getElementById(), though using the form name via document.forms[] is also valid. I'd also add that you can use the following code (as long as you have set the values of each of the options):
Expand|Select|Wrap|Line Numbers
  1. var combo1 = document.getElementById("combo1").value;
Jun 30 '09 #7
mukeshrasm
254 100+
@acoder
thanks for kind effort to solve the problem!
Jun 30 '09 #8
button:
Expand|Select|Wrap|Line Numbers
  1. <input name="btnGo" value=" Search " class="seinput" type="submit" onclick="javascript:submitSearch();">
select option:
Expand|Select|Wrap|Line Numbers
  1. <select name="category" class="catpinput">
  2.                     <option value="-1" selected="selected">All Category</option>
JS Function:
Expand|Select|Wrap|Line Numbers
  1. function submitSearch()
  2. {
  3. var catkey = $('.catpinput').val();
  4. window.alert(catkey);
  5. }
Oct 14 '10 #9
acoder
16,027 Expert Mod 8TB
That's not JavaScript (OK, technically, it is, but it requires jQuery which you should mention).

There's also no need to use the "javascript:" protocol in an onclick.
Oct 14 '10 #10

Post your reply

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

Similar topics

4 posts views Thread by Peter Moscatt | last post: by
3 posts views Thread by Stanley J Mroczek | last post: by
1 post views Thread by Marc Jennings | last post: by
5 posts views Thread by Kris Rockwell | last post: by
3 posts views Thread by Randy Rubin | last post: by
4 posts views Thread by juststarter | last post: by
reply views Thread by Eirik Eldorsen | last post: by
4 posts views Thread by Ronny Mandal | last post: by
1 post views Thread by Waqarahmed | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.