Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use onClick() or onSelect() on option tag in a JSP page?

Tags:

javascript

How to use onClick() or onSelect() with option tag? Below is my code in which I tried to implement that, but it is not working as expected.

Note: where listCustomer domain object list getting in JSP page.

<td align="right">    <select name="singleSelect" ">       <c:forEach var="Customer" items="${listCustomer}" >      <option value="" onClick="javascript:onSelect(this);> <c:out value="${Customer}" /></option>                 </c:forEach>           </select>                  </td>    

How do I modify it to detect that an option is selected?

like image 959
Manu Avatar asked Aug 15 '10 12:08

Manu


People also ask

Does onClick work on option tag?

Neither the onSelect() nor onClick() events are supported by the <option> tag. The former refers to selecting text (i.e. by clicking + dragging across a text field) so can only be used with the <text> and <textarea> tags.

How to use onClick in option?

The onClick() event can be used with <select> tags – however, you probably are looking for functionality where it would be best to use the onChange() event, not onClick() . Furthermore, by the look of your <c:...> tags, you are also trying to use JSP syntax in a plain HTML document.


2 Answers

Neither the onSelect() nor onClick() events are supported by the <option> tag. The former refers to selecting text (i.e. by clicking + dragging across a text field) so can only be used with the <text> and <textarea> tags. The onClick() event can be used with <select> tags - however, you probably are looking for functionality where it would be best to use the onChange() event, not onClick().

Furthermore, by the look of your <c:...> tags, you are also trying to use JSP syntax in a plain HTML document. That's just... incorrect.

In response to your comment to this answer - I can barely understand it. However, it sounds like what you want to do is get the value of the <option> tag that the user has just selected whenever they select one. In that case, you want to have something like:

<html>  <head>   <script type="text/javascript">     function changeFunc() {     var selectBox = document.getElementById("selectBox");     var selectedValue = selectBox.options[selectBox.selectedIndex].value;     alert(selectedValue);    }    </script>  </head>  <body>   <select id="selectBox" onchange="changeFunc();">    <option value="1">Option #1</option>    <option value="2">Option #2</option>   </select>  </body> </html> 
like image 177
Stephen Avatar answered Sep 21 '22 13:09

Stephen


Even more simplified: You can pass the value attribute directly!

<html>  <head>   <script type="text/javascript">     function changeFunc(i) {      alert(i);    }    </script>  </head>  <body>   <select id="selectBox" onchange="changeFunc(value);">    <option value="1">Option #1</option>    <option value="2">Option #2</option>   </select>  </body> </html> 

The alert will either return 1 or 2.

like image 26
Hannes Schneidermayer Avatar answered Sep 21 '22 13:09

Hannes Schneidermayer