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 7 of 7
  1. #1
    New Coder
    Join Date
    May 2004
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Still submits the form even when there is an error

    I dont know what is wrong with this javascript code. There are two text fields in this form (AmtPaidTakaful and AmtPaidOthers) and 2 radio buttons with the same name (TakingTakaful) . The radio button has two possible values (Yes, No)

    If the radio button value is Yes, Then user has to fill up AmtPaidTakaful

    If the radio button value is No, Then user has to fill up AmtPaidOthers

    And both AmtPaidTakaful and AmtPaidOthers are numeric fields.

    The problem here is that it still submits the form after displaying the error message. It means that after user have clicked 'ok' in the error message box, it submits the form. I dont know what is wrong with the code

    Here is how the code looks like

    <script language="JavaScript">

    function validateradiobutton(thisform) {

    myOption = -1;
    for (i=0; i<thisform.TakingTakaful.length; i++) {
    if (thisform.TakingTakaful[i].checked) {
    myOption = i;
    }
    }

    missinginfo = "";


    var digits1="0123456789.-"
    var temp12
    var temp11 = 0

    if(myOption == 0 && thisform.AmtPaidTakaful.value == ""){
    temp11 = 1;
    }

    for (var j=0;j<document.registrationForm.AmtPaidTakaful.value.length;j++){
    temp12=document.registrationForm.AmtPaidTakaful.value.substring(j,j+1)
    if (digits1.indexOf(temp12)==-1){
    temp11 = 1;
    }
    }

    if (temp11 == 1){
    document.getElementById("a").style.backgroundColor = "#ffffc0";
    missinginfo += "\n - Amount Paid for Takaful Insurance";
    }

    else{
    document.getElementById("a").style.backgroundColor = "#ffffff";
    }

    var digits="0123456789.-"
    var temp2
    var temp1 = 0

    if(myOption == 1 && thisform.AmtPaidOthers.value == ""){
    temp1 = 1;
    }

    for (var z=0;z<document.registrationForm.AmtPaidOthers.value.length;z++){
    temp2=document.registrationForm.AmtPaidOthers.value.substring(z,z+1)
    if (digits.indexOf(temp2)==-1){
    temp1 = 1;
    }
    }

    if (temp1 == 1){
    document.getElementById("c").style.backgroundColor = "#ffffc0";
    missinginfo += "\n - Amount Paid for Other Insurance";
    }

    else{
    document.getElementById("c").style.backgroundColor = "#ffffff";
    }

    if (missinginfo != "") {
    missinginfo ="_____________________________\n" +
    "The following fields are incomplete/erroneous:\n" +
    missinginfo + "\n_____________________________" +
    "\nPlease re-enter and submit again!";
    alert(missinginfo);
    return false;
    }
    else
    return true;
    }

    </script>

    Please help..Thankxxxxx

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Are you calling validateradiobutton function like this?

    <form onsubmit="return validateradiobutton(this)">
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    New Coder
    Join Date
    May 2004
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nope im calling it like this

    onsubmit="validateradiobutton(registrationForm)"

    registrationForm is the name of the form

  • #4
    New Coder
    Join Date
    May 2004
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <form onsubmit="return validateradiobutton(this)">

    Even if i call it like this, it still submits the form after displaying the error message

  • #5
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Can you post the whole code or link?
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #6
    New Coder
    Join Date
    May 2004
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <html>
    <head>
    <title>addotherinformation</title>

    <LINK REL="stylesheet" TYPE="text/css" HREF="registration.css">

    <style type="text/css">
    <!--
    .style3 {
    color: #FF0000;
    font-size: xx-small;
    }
    -->
    </style>

    <script language="JavaScript">

    function validateradiobutton(thisform) {

    myOption = -1;
    for (i=0; i<thisform.TakingTakaful.length; i++) {
    if (thisform.TakingTakaful[i].checked) {
    myOption = i;
    }
    }

    missinginfo = "";


    var digits1="0123456789.-"
    var temp12
    var temp11 = 0

    if(myOption == 0 && thisform.AmtPaidTakaful.value == ""){
    temp11 = 1;
    }

    for (var j=0;j<document.registrationForm.AmtPaidTakaful.value.length;j++){
    temp12=document.registrationForm.AmtPaidTakaful.value.substring(j,j+1)
    if (digits1.indexOf(temp12)==-1){
    temp11 = 1;
    }
    }

    if (temp11 == 1){
    document.getElementById("a").style.backgroundColor = "#ffffc0";
    missinginfo += "\n - Amount Paid for Takaful Insurance";
    }

    else{
    document.getElementById("a").style.backgroundColor = "#ffffff";
    }

    var digits="0123456789.-"
    var temp2
    var temp1 = 0

    if(myOption == 1 && thisform.AmtPaidOthers.value == ""){
    temp1 = 1;
    }

    for (var z=0;z<document.registrationForm.AmtPaidOthers.value.length;z++){
    temp2=document.registrationForm.AmtPaidOthers.value.substring(z,z+1)
    if (digits.indexOf(temp2)==-1){
    temp1 = 1;
    }
    }

    if (temp1 == 1){
    document.getElementById("c").style.backgroundColor = "#ffffc0";
    missinginfo += "\n - Amount Paid for Other Insurance";
    }

    else{
    document.getElementById("c").style.backgroundColor = "#ffffff";
    }

    if (missinginfo != "") {
    missinginfo ="_____________________________\n" +
    "The following fields are incomplete/erroneous:\n" +
    missinginfo + "\n_____________________________" +
    "\nPlease re-enter and submit again!";
    alert(missinginfo);
    return false;
    }
    else
    return true;
    }

    </script>


    <style type="text/css">
    <!--
    .style2 {color: #FFFFFF}
    -->
    </style>
    </head>

    <body bgcolor="#ffffff">

    <cfset takaful = #Trim(updateinsurance.TakingTakaful)#>
    <cfset type = #Trim(updateinsurance.InsuranceType)#>

    <img name="editinsuranceinfo" src="images/editinsuranceinfo.gif" width="750" height="90" border="0" alt="">

    <FORM NAME="registrationForm" method = "post" action="updatestudentregistrationfinal.cfm" onsubmit="validateradiobutton(registrationForm)">

    <cfoutput query="updateinsurance">

    <TABLE ID="RegistrationForm" CELLSPACING="0" CELLPADDING="3">

    <tr>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>
    <TD><LABEL>Taking Takaful Insurance: </LABEL></TD>
    <cfif takaful eq "Yes">
    <TD><INPUT TYPE="radio" NAME="TakingTakaful" value = "Yes" id = "radio1" checked></TD>
    <td><label>Yes</label></td>
    <td><INPUT TYPE="radio" NAME="TakingTakaful" value = "No" id = "radio2"></td>
    <td><label>No</label></td>
    <cfelse>
    <TD><INPUT TYPE="radio" NAME="TakingTakaful" value = "Yes" id = "radio1"></TD>
    <td><label>Yes</label></td>
    <td><INPUT TYPE="radio" NAME="TakingTakaful" value = "No" id = "radio2" checked></td>
    <td><label>No</label></td>
    </cfif>

    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>

    <td>Amount Paid:</td>
    <TD><span class="style2">.</span>RM<span class="style2">.</span>
    <INPUT TYPE="text" NAME="AmtPaidTakaful" size = "8" maxlength="8" value="#Trim(AmtPaidTakaful)#" id="a"></TD>
    </TR>
    </table>

    <br>
    <TABLE ID="RegistrationForm" CELLSPACING="0" CELLPADDING="3">

    <tr>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>
    <td><span class="style3"><span class="style2">..</span>*Please fill-up the following fields if student is <strong>not</strong> taking Takaful Insurance</span></td>
    </table>
    <br>

    <TABLE ID="RegistrationForm" CELLSPACING="0" CELLPADDING="3">

    <tr>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>



    <TD><LABEL>Type of Insurance: </LABEL></TD>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>

    <cfif type eq "MCIA">
    <TD><select name="InsuranceType">
    <option value="#InsuranceType#">#InsuranceType#</option>
    <option value="AIA">AIA</option>
    <option value="Others">Others</option>
    <option value="none">none</option>
    </select></TD>

    <cfelseif type eq "AIA">
    <TD><select name="InsuranceType">
    <option value="#InsuranceType#">#InsuranceType#</option>
    <option value="MCIA">MCIA</option>
    <option value="Others">Others</option>
    <option value="none">none</option>
    </select></TD>

    <cfelseif type eq "Others">
    <TD><select name="InsuranceType">
    <option value="#InsuranceType#">#InsuranceType#</option>
    <option value="MCIA">MCIA</option>
    <option value="AIA">AIA</option>
    <option value="none">none</option>
    </select></TD>

    <cfelse>
    <TD><select name="InsuranceType">
    <option value="#InsuranceType#">#InsuranceType#</option>
    <option value="MCIA">MCIA</option>
    <option value="AIA">AIA</option>
    <option value="Others">Others</option>
    </select></TD>

    </cfif>
    <td></td>
    <td></td>
    <td></td>
    <td></td>


    </TR>

    <tr>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>
    <TD></TD>
    <TD></TD>

    <TD></TD>
    <TD></TD>



    <TD><LABEL>Amount Paid: </LABEL></TD>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td>RM</td>

    <TD><INPUT TYPE = "text" NAME = "AmtPaidOthers" size = "8" maxlength="8" value="#Trim(AmtPaidOthers)#" id="c"></TD>

    <td></td>
    <td></td>
    <td></td>
    <td></td>

    </TR>

    </table>
    </cfoutput>
    <table width = "65%">
    <br><br>
    <input type="image" name="test" src="updateonmouseout.gif" onMouseDown="this.src='updateonmousedown.gif';" onMouseOver="this.src='updateonmouseover.gif';" onMouseOut="this.src='updateonmouseout.gif';" align = "right">

    </table>

    </form>

    </body>
    </html>

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    I tested it using my suggestion earlier and it works fine.

    onsubmit="return validateradiobutton(this)"

    Using the this keyword inside the form tag is better. Referencing elements directly by its name is an IE thing only.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  

    Posting Permissions

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