radio buttons if then else

Discussion in 'JavaScript' started by fraser5002, Mar 29, 2005.

  1. #1
    hi after having been giving great help the othe rday i have one more problem i would like to ask about. im trying to use a function to work out which radio button has been selected. I dont really fully understand functions so i hope i have set this out right . Anyway its not working and errors appear on the page.

    am i close?

    <form name="payment">
    <div align="center">
      <table border="0" height="74" width="371">
        <tr>
          <td height="12" width="600">
            <p align="right"><font size="2">I'm buying a £0.50 photo&nbsp;
            (1600 x 1200)</font></p>
          </td>
      <center>
          <td height="12" width="26"><input type="radio" value="V1" checked name="R1"></td>
          <td height="12" width="29">&nbsp;&nbsp;</td>
        </tr>
      </center>
        <tr>
          <td height="25" width="600">
            <p align="right"><font size="2">I'm buying a £1.00 photo (2048
            x 1536)</font></p>
          </td>
      <center>
          <td height="25" width="26"><input type="radio" name="R1" value="V2"></td>
          <td height="25" width="29"><font size="2">
          
          <img border="0" src="x-click-but23.gif" align="center" width="68" height="23" onclick="decision(<V1>,<V2>,<V3>)">
    
          </font></td>
        </tr>
      </center>
        <tr>
          <td height="25" width="600">
            <p align="right"><font size="2">I'm buying a Image CD costing
            £6.00</font></p>
          </td>
      <center>
          <td height="25" width="26"><input type="radio" name="R1" value="V3"></td>
          <td height="25" width="29"></td>
        </tr>
      </table>
      </center>
    </div>
    
    <p align="center"><font size="2">&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    </font>
    </p>
    <script type="text/javascript">
          <!--
    function decision(V1,V2,V3){
      if(document.form.V1.checked) {
        window.alert("test");
      } else if(document.form.V2.checked) {
        window.alert("test");
      } else if(document.form.V3.checked) {
        window.alert("test");
      } else {
        window.alert("Pick something!!");
      }
    }// -->
    </script>
    
    
    </form>
    Code (markup):
    thanks again
     
    fraser5002, Mar 29, 2005 IP
  2. draculus

    draculus Peon

    Messages:
    63
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    When radio buttons have the same name to group them together javascript treats them as an array not individual elements. So your function needs to change to:

    function decision(V1,V2,V3){
    if(document.form.R1[0].checked) {
    window.alert("test");
    } else if(document.form.R1[1].checked) {
    window.alert("test");
    } else if(document.form.R1[2].checked) {
    window.alert("test");
    } else {
    window.alert("Pick something!!");
    }
    }


    The parameters you are passing to the function are not used.
     
    draculus, Mar 29, 2005 IP
  3. fraser5002

    fraser5002 Guest

    Messages:
    10
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    thansk for your advice i have changed the code to what you said but i am still getting errors. This is the page
    http://homepage.ntlworld.com/fraser_d/buy-scottish-photos.htm
    i just cannot work it out any ideas of what else im doing wrong?
    thanks
     
    fraser5002, Mar 29, 2005 IP
  4. draculus

    draculus Peon

    Messages:
    63
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #4
    This line is incorrect:

    <img border="0" src="x-click-but23.gif" align="center" width="68" height="23" onclick="decision(<V1>,<V2>,<V3>">

    The closing bracket on the decision function call is missing. I also do not see what the <V1> etc parameters are. Change the above line to:

    <img border="0" src="x-click-but23.gif" align="center" width="68" height="23" onclick="decision()">

    and change thew function header to:

    function decision() {

    That will remove your javascript errors.
     
    draculus, Mar 29, 2005 IP
  5. fraser5002

    fraser5002 Guest

    Messages:
    10
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    thansk for your advice spot on! nearly there :) just a couple more bugs
     
    fraser5002, Mar 29, 2005 IP