Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Nov 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript Function Not Working for Radio buttons

    Hi,
    I have the following code within my html form. I can get the Javascript validation working for the rest of the form but not the radio buttons. Its not processing the function. Please advise. Go easy, I try my best!


    Code:

    <form action="" method="post" onsubmit="return ValidateForm(this);"
    id="myform">

    <script type="text/javascript">
    function ValidateForm(frm) {
    if (frm.Tevent.value == "") {alert('Type of event is required.');frm.Tevent.focus();return false;}
    if (frm.Devent.value == "") {alert('Date of event is required.');frm.Devent.focus();return false;}
    if (frm.CateringType.value == "") {alert('Please tell us the type of catering you require.');frm.CateringType.focus();return false;}

    //validate radio buttons
    mybuttons = -1;
    for (i=myform.NumberP.length-1; i > -1; i--) {
    if (my.NumberP[i].checked) {
    mybuttons = i; i = -1;
    }
    }
    if (mybuttons == -1) {
    alert("Please enter number of people that catering is required for.");
    return false;frm.NumberP.focus();
    }
    thisform.submit();
    }

    </script>

    <p align="left"><font face="Arial, Helvetica, sans-serif" color="orange">Type of Event:
    <input type="text" name="Tevent" value="" size="50" />
    </font> </p>
    <p align="left"><font face="Arial, Helvetica, sans-serif" color="orange">Date of Event:
    <input type="text" name="Devent" value="" size="20" />
    </font> </p>
    <p align="left"><font face="Arial, Helvetica, sans-serif" color="orange">Time catering is required:
    <input type="text" name="CateringReq" value="" size="40" />
    </font> </p>
    <p align="left"><font face="Arial, Helvetica, sans-serif" color="orange">Number of people catering for:<br><br>
    <input type="radio" name="NumberP" value="0-25">0-25
    <input type="radio" name="NumberP" Value="26-50">26-50</font> </p>

    <p align="right"><font face="Arial, Helvetica, sans-serif" align="right" color="orange">
    <input type="submit" value="Submit">
    </font> </p>
    </form>

  • #2
    New Coder
    Join Date
    Oct 2012
    Location
    Basement
    Posts
    88
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Please wrap your codes into the wrap CODE #'s

    This is where you go wrong:

    Code:
    <script type="text/javascript">
    It should be:

    Code:
    <script type = "text/javascript" src = 'nameofjsfilehere (example javascript.js)'>

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,142
    Thanks
    203
    Thanked 2,547 Times in 2,525 Posts
    Quote Originally Posted by optimizer123 View Post
    Please wrap your codes into the wrap CODE #'s

    This is where you go wrong:

    Code:
    <script type="text/javascript">
    It should be:

    Code:
    <script type = "text/javascript" src = 'nameofjsfilehere (example javascript.js)'>
    I am afraid that that is totally incorrect. You are not using an external .js file. optimizer123 should stay in his basement.

    You do have an error - CateringType should be CateringReq to match the field name.

    Code:
    <form  name = "myform" id="myform"  action="" method="post" onsubmit="return ValidateForm(this);">
    
    <script type="text/javascript">
    
    function ValidateForm(frm) {
    if (frm.Tevent.value == "") {alert('Type of event is required.');frm.Tevent.focus();return false;}
    if (frm.Devent.value == "") {alert('Date of event is required.');frm.Devent.focus();return false;}
    if (frm.CateringReq.value == "") {alert('Please tell us the type of catering you require.');frm.CateringReq.focus();return false;}
    
    //validate radio buttons
    var mybuttons = -1;
    for (var i=0; i <=1; i++)  {
    if (document.myform.NumberP[i].checked) {
    mybuttons = i; 
    alert (document.myform.NumberP[i].value);  // the selected value
    }
    }
    
    if (mybuttons == -1) {
    alert ("Please select the number of people that catering is required for.");
    // You can't focus on a radio buttion group
    return false;
    }
    
    frm.submit(); 
    
    }
    </script>

    "A man would do nothing, if he waited until he could do it so well that no one at all would find fault with what he has done." - Cardinal Newman

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •