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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    May 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Enable submit button when correct radio is selected

    Hi all.

    New to JS and needing a little assistance. I have the following JS function:

    function validateRadio(obj,correct){
    frm=document.forms[0]
    var result = 0
    for(var i=0; i<obj.length; i++){
    if(obj[i].checked==true && obj[i].value==correct) result = 1
    }

    if(!result && obj.value == correct) result = 1

    return result
    }

    and in the body I have the following radio buttons:

    <input name = "a" value="Warranty" onclick="if(validateRadio(this,'Warranty')) alert('Correct. You may proceed.')" type="radio">Warranty
    <input name = "a" value="Durability" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect')" type="radio">Durability
    <input name = "a" value="Cost" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect')" type="radio">Cost
    <input name = "a" value="Because" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect')" type="radio">Because

    with the html button:

    <INPUT TYPE=button VALUE="Next" NAME="nButton">

    On loading the page, I am disabling the button. Once the correct radio button is selected by the user, and I alert them the answer is correct, I would like to enable the Next button. If the answer is incorrect, keep it disabled.

    Any suggestions?

    TIA,
    Clint

  • #2
    New to the CF scene
    Join Date
    May 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    nevermind

    changed it to the following and it works perfect:

    <input name = "a" value="Warranty" onclick="if(validateRadio(this,'Warranty')) alert('Correct. You may proceed.');frm.nButton.disabled=false" type="radio">Warranty
    <input name = "a" value="Durability" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');frm.nButton.disabled=true" type="radio">Durability
    <input name = "a" value="Cost" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');frm.nButton.disabled=true" type="radio">Cost
    <input name = "a" value="Because" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');frm.nButton.disabled=true" type="radio">Because

  • #3
    Regular Coder
    Join Date
    Jan 2004
    Location
    San Antonio, TX
    Posts
    131
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question along those same lines...

    I like this script, and I would like to know if you can take it a step further, by just getting rid of the 'Next' button all-together and make the 'OK' on the correct alert send the user to the next page/question? Any suggestions on how to re-do this code?

    Thanks,
    Imperial Spider

    Code:
    <script language="javascript/text">
    
    function validateRadio(obj,correct){
    frm=document.forms[0]
    var result = 0
    for(var i=0; i<obj.length; i++){
    if(obj[i].checked==true && obj[i].value==correct) result = 1
    }
    
    if(!result && obj.value == correct) result = 1
    
    return result
    }
    
    </script>
    
    What do you get when you buy a brand new car?<p>
    
    <input name = "a1" value="Warranty" onclick="if(validateRadio(this,'Warranty')) alert('Correct. You may proceed.');" type="radio">Warranty
    
    <input name = "a2" value="Golfing skills" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">Golfing Skills
    
    <input name = "a3" value="A new Pet" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">A New Pet
    
    <input name = "a4" value="Super Powers" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">Super Powers
    
    <p>

  • #4
    Regular Coder
    Join Date
    Jan 2004
    Location
    San Antonio, TX
    Posts
    131
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Thumbs up LOL never mind... I figured it out

    Code:
    <script language="javascript">
    
    function validateRadio(obj,correct){
    frm=document.forms[0]
    var result = 0
    for(var i=0; i<obj.length; i++){
    if(obj[i].checked==true && obj[i].value==correct) result = 1
    }
    
    if(!result && obj.value == correct) result = 1
    
    return result
    }
    
    </script>
    
    What do you get when you buy a brand new car?<p>
    <input name = "a" value="Warranty" onclick="if(validateRadio(this,'Warranty')) alert('Correct. You may proceed.');location='page2.html'" type="radio">Warranty
    <input name = "a" value="Golfing skills" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">Golfing Skills
    <input name = "a" value="A new Pet" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">A New Pet
    <input name = "a" value="Super Powers" onclick="if(!validateRadio(this,'Warranty')) alert('Incorrect');" type="radio">Super Powers
    <p>
    Thanks

    Imperial Spider


  •  

    Posting Permissions

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