1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 6:03 pm May 13, 2026

Forum Moderators: open

Message Too Old, No Replies

Calling function based on dropdown selection

         

maverick90

10:08 pm on Apr 16, 2014 (gmt 0)

10+ Year Member



I have a code for the properties of circle like area and circumference, I what i need is to be able to display the results using different units and significant digits after the decimal, but somehow i am not able call the convertUnit() function in drop down and also the compute3(circumf) and compute4(ar)



<HTML>
 <TITLE>
  CIRCLE
 </TITLE>
 <script type="text/javascript">
  function convertUnit() {
  var fromunits = document.txtdia.fromunits;
  var fromIndex = fromunits.selectedIndex;


  var indx = fromIndex();  //.toString
  switch (indx) {

  case '11':

   var Dia = document.unitForm.txtdia.value / 39.3701;
   break;

  case '22':

   var Dia = document.unitForm.txtdia.value / 3.28084;
   break;

  case '33':

   var Dia = document.unitForm.txtdia.value / 1.09361;
   break;

  case '44':

   var Dia = document.unitForm.txtdia.value / 100;
   break;

  case '55':

   var Dia = document.unitForm.txtdia.value / 1000;
   break;


   }

   function compute3(circumf) {
    var Dia = document.getElementById("txtdia").value;
    var Dia = parseFloat(circumf.dia.value);
    var rd = parseFloat(circumf.rd.selectedIndex);
    circumf.circumference.value = (Dia * Math.PI).toPrecision(rd);
    circumf.Dia.value = Dia.toPrecision(rd);
    circumf.rd.value = rd;
   }

   function compute4(ar) {
    var Dia = document.getElementById("txtdia").value;
    var Dia = parseFloat(ar.dia.value);
    var rd = parseFloat(ar.rd.selectedIndex);
    ar.area.value = ((Dia / 2) * (Dia / 2) * Math.PI).toPrecision(rd);
    ar.Dia.value = Dia.toPrecision(rd);
    ar.rd.value = rd;
   }
 </script>
 <FORM>
  <tr>
   <td>
    Select Global Units
   </td>
   <p>
    <select name="fromList" onchange="convertunit()">
     <option value="metres" selected="selected">
      metres
     </option>
     <option value="inches">
      inches
     </option>
     <option value="feet">
      feet
     </option>
     <option value="yard">
      yard
     </option>
     <option value="centimeter">
      centimeter
     </option>
     <option value="millimeter">
      millimeter
     </option>
    </select>
   </p>
   </td>
  </tr>
  <tr>
   <td>
    Select Significant Figures
   </td>
   <td align="left">
    &nbsp;
    <select onchange=compute(form),compute2(form); id="rd">
     <option value="0">
     </option>
     <option value="1">
      1
     </option>
     <option value="2">
      2
     </option>
     <option value="3" selected>
      3
     </option>
     <option value="4">
      4
     </option>
     <option value="5">
      5
     </option>
     <option value="6">
      6
     </option>
     <option value="7">
      7
     </option>
     <option value="8">
      8
     </option>
     <option value="9">
      9
     </option>
     <option value="10">
      10
     </option>
     <option value="11">
      11
     </option>
     <option value="12">
      12
     </option>
     <option value="13">
      13
     </option>
     <option value="14">
      14
     </option>
     <option value="15">
      15
     </option>
    </select>
   </td>
  </tr>
  <tr>
   <td>
    Diameter:
   </td>
   <td width="33%">
    <INPUT onchange=compute(form), compute2(form),compute3(circumf),compute4(ar);
    value="" maxLength=9 size=16 name=Dia>
   </td>
  </tr>
  <tr>
   <td width="33%">
    circumference in meter
   </td>
   <td width="33%">
    <INPUT value=" " maxLength=7 size=16 name=circumf>
   </td>
  </tr>
  <tr>
   <td width="33%">
    area in sq meter
   </td>
   <td width="33%">
    <INPUT value=" " maxLength=7 size=16 name=ar>
   </td>
  </tr>
 
 </FORM>
 </HTML>

Fotiman

3:57 pm on Apr 17, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



You're missing a closing } before your compute3 function (the closing } that's there is closing the switch, not the function). Your onchange handlers are trying to call methods that don't exist, like compute2. Your handlers are also missing quotes around the value:
onchange=compute...
should be:
onchange="compute..."
In the handler, you can call multiple functions by separating them with semicolons, not commas as you have it.
onchange="function1();function2();function3();"

maverick90

4:39 pm on Apr 17, 2014 (gmt 0)

10+ Year Member



Thanks Fotiman....i tired out the corrections but was not successful, Instead I tried a different approach to the same problem, but still having the same issues,I was hoping if you could correct me with this one as well..it would be fair enough to tell you that I am new to javascript...here is the code that I have


<HTML>
 <TITLE>
  CIRCLE
 </TITLE>
 <script type="text/javascript">
  

  
   function unitconversion(){
document.getElemntById("fromList").onchange=unitconversion()

    var Dia = document.getElementById("txtdia").value;
    var Dia = parseFloat(dia.value);
    var rd = parseFloat(rd.selectedIndex);

if(value=="meters"){
    
    
    circumference.value = (Dia * Math.PI).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    rd.value = rd;
    document.getElementById("circumf").value = var circumference;
}

else if(value=="inches"){
    
    

    circumference = ((Dia * Math.PI)/39.3701).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    rd.value = rd;
    document.getElementById("circumf").value = var circumference;
}

else if(value=="feet"){

    
    
    circumference = ((Dia * Math.PI)/3.28084).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    rd.value = rd;
    document.getElementById("circumf").value = var circumference;
   
}

else if(value=="yard"){
    
    
    circumference = ((Dia * Math.PI)/3.28084).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    rd.value = rd;
    document.getElementById("circumf").value = var circumference;
}

else if(value=="centimeter"){
    
    
    circumference = ((Dia * Math.PI)/100).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    rd.value = rd;
    document.getElementById("circumf").value = var circumference;
}

else if(value=="millimeter"){
    
    
    circumference.value = ((Dia * Math.PI)/1000).toPrecision(rd);
    Dia.value = Dia.toPrecision(rd);
    [size=3][/size]rd.value = rd;
    document.getElementById("circumf").value = var circumference;
}


 </script>
 <FORM>
  <tr>
   <td>
    Select Global Units
   </td>
   <p>
    <select id="fromList" onchange="unitconversion()">
     <option value="metres" selected="selected">
      metres
     </option>
     <option value="inches">
      inches
     </option>
     <option value="feet">
      feet
     </option>
     <option value="yard">
      yard
     </option>
     <option value="centimeter">
      centimeter
     </option>
     <option value="millimeter">
      millimeter
     </option>
    </select>
   </p>
   </td>
  </tr>
  <tr>
   <td>
    Select Significant Figures
   </td>
   <td align="left">
    &nbsp;
    <select onchange="unitconversion()"; id="rd">
     <option value="0">
     </option>
     <option value="1">
      1
     </option>
     <option value="2">
      2
     </option>
     <option value="3" selected>
      3
     </option>
     <option value="4">
      4
     </option>
     <option value="5">
      5
     </option>
     <option value="6">
      6
     </option>
     <option value="7">
      7
     </option>
     <option value="8">
      8
     </option>
     <option value="9">
      9
     </option>
     <option value="10">
      10
     </option>
     <option value="11">
      11
     </option>
     <option value="12">
      12
     </option>
     <option value="13">
      13
     </option>
     <option value="14">
      14
     </option>
     <option value="15">
      15
     </option>
    </select>
   </td>
  </tr>
  <tr>
   <td>
    Diameter:
   </td>
   <td width="33%">
    <INPUT onchange="unitconversion()";
    value="" maxLength=9 size=16 id="txtdia">
   </td>
  </tr>
  <tr>
   <td width="33%">
    circumference in meter
   </td>
   <td width="33%">
    <INPUT value=" " maxLength=7 size=16 id="circumf">
   </td>
  </tr>
  <tr>
   <td width="33%">
    area in sq meter
   </td>
   <td width="33%">
    <INPUT value=" " maxLength=7 size=16 id=ar>
   </td>
  </tr>
 
 </FORM>
 </HTML>

Fotiman

5:40 pm on Apr 17, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month


Your code is still invalid. Missing }.

Note, when posting code to this forum, it can be helpful to wrap it in:
[quote][pre][code]
[/code][/pre][/quote]

That will help keep some of your formatting.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

  1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 6:03 pm May 13, 2026