3

I have the following javascript function.

<script type="text/javascript">
function showhidefields(value,formobj,epsflag,respflag) {
  //alert(epsflag);
  if (epsflag==0 && respflag==4) {
    document.getElementById("tpnr").style.position = "static";
    document.getElementById("tpnr").style.top = "0px";
    formobj.tussenPersoonNotext.disabled =false;
    formobj.email.disabled =true;                  
  }
</script>

<select name="moduleidval" class="validate['required']">
   <option value="">-- Selecteer Proces--</option>
   <option onclick="showhidefields(this.value,this.form,'<?php echo 1; ?>');" 
   value="<?php echo $epsmodules; ?>"><?php echo 'MBO'; ?></option>
</select>

My problem is when i click on the option in case of firefox or IE the onclick event fires but in case of chrome it doesnot fire at all.i tried changing the function name also but no luck.

fiddle

thanks in Advance

5 Answers 5

3

option elements don't fire the click event in all browsers, you should stray away from relying on this. Instead you can use onchange() event for select. You may use something like this

<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>`enter code here`
  </select>
 </body>`enter code here`
</html>

In Your case you use like

<form id='myForm' action="#">
  <select id='mySelect' name="moduleidval" class="validate['required']" onchange="showhidefields(this.value,this.form,'0');">
   <option value="-">-- Selecteer Proces--</option>
   <option value="1"> 'Klantprocessen'</option>
</select>
</form>
3
  • 1
    Use onchange to select not for option Commented Dec 4, 2013 at 5:34
  • thanks for this approach,+1 for that but still it doesnot answer my question that why my code is not working but i will accept it :)
    – R R
    Commented Dec 4, 2013 at 10:04
  • jsbin.com/iHEgaQiW/1/edit here it is,its just a snipett from my actual code.
    – R R
    Commented Dec 4, 2013 at 11:09
3

Sure, there is no click event on an option tag.

You may listen to the onchange event of the select tag.

 <!-- HTML -->
<form id='myForm' action="#">
    <select id='mySelect' name="moduleidval" class="validate['required']">
      <option value="-">-- Selecteer Proces--</option>
      <option value="MBO">MBO</option>
    </select>
</form>

// JavaScript
document.getElementById('mySelect').onchange = function(){
    alert('value:'+this.value); 
    alert('form id:' + this.form.id);
}

See Demo here

2
  • Paste part of your code on jsbin.com. Maybe you come to another problem. @RishabhRaj
    – Frank Fang
    Commented Dec 4, 2013 at 5:06
  • @RishabhRaj jsbin.com/iHEgaQiW/5/edit OK,now. Move onchange=* into the select tag. not the option tag.
    – Frank Fang
    Commented Dec 5, 2013 at 5:10
1

Few browsers lack in support of onclick event of option tag. Here is the reference enter image description here

so you can go for onchange of select tag.

1
  • 1
    Uhh... looks like this reference is from year 2007, a lot has changed after that...
    – Teemu
    Commented Dec 4, 2013 at 5:17
1

You can pass the value directly in the function specified, like:

<select onchange="trig(value);">

This value can then be used in the trig function.

function trig(val) {
    //do foo
    alert(val);
}

Short and simple.

A working demo in Chrome: http://jsfiddle.net/amarprabhu/9C3VU/

-3

Check javascript is enabled in ur chrome.

Select Customize and control Google Chrome to the right of the address bar

From the drop-down menu, select Settings

At the bottom of the page, click Show advanced settings…

Under Privacy, click the Content settings… button

Under the JavaScript heading, select the Allow all sites to run JavaScript radio button
1
  • i have javascript enabled in my chrome browser
    – R R
    Commented Dec 4, 2013 at 4:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.