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

    Unhappy Radio buttons . . . still not clear

    I have been trying to figure out how to work with radio buttons and javascript. In the script below I wish to grab the value of the selected radio button.
    The value of the text "tyear" box is obtained with no problem, and is reported in the aler message.

    The radio buttons named "grouptype" are found, but the value of the selected button is reported as undefined. The html code has a value set for each radio button.

    Code:
    function checkForm(formobj){
    	
    	// Enter name of mandatory fields
    	var fieldRequired = Array("organizationName", "tyear", "grouptype");
    	
    	// Enter field description to appear in the dialog box
    	var fieldDescription = Array("Organization Name", "Year", "Group Type");
    	
    	// dialog message
    	var alertMsg = "Please complete the following fields:\n";
    
    	var l_Msg = alertMsg.length;
    
    	
    	for (var i = 0; i < fieldRequired.length; i++){
    		var obj = formobj.elements[fieldRequired[i]];
    		
                             //textbox tyear value
    		if (fieldRequired[i] == "tyear")
    		{
    			alert(obj.value);
    		}
                              // radio button grouptype value
    		if (fieldRequired[i] == "grouptype")
    		{
    			alert(obj.value);
    		}
    		
    		
    		if (obj){
    			switch(obj.type){
    			case "select-one":
    				if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			case "select-multiple":
    				if (obj.selectedIndex == -1){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			case "text":
    			case "textarea":
    				if (obj.value == "" || obj.value == null){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			default:
    			}
    			if (obj.type == undefined){
    				var blnchecked = false;
    				for (var j = 0; j < obj.length; j++){
    					if (obj[j].checked){
    						blnchecked = true;
    					}
    				}
    				if (!blnchecked){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    			}
    		}
    	}
    
    	if (alertMsg.length == l_Msg){
    		return true;
    	}else{
    		alert(alertMsg);
    		return false;
    	}
    }

  • #2
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    Radio buttons are stored in an array.
    You get the value like:
    formname.radioname[0].value
    formname.radioname[1].value
    and so on

    So, you need to get the value IF it is checked, right?
    if (formname.radioname[0].checked)
    alert(formname.radioname[0].value);

    and so on.
    If there are a bunch, you can loop through the collection.

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #3
    Regular Coder
    Join Date
    Aug 2005
    Location
    Toronto, ON, Canada
    Posts
    231
    Thanks
    0
    Thanked 0 Times in 0 Posts
    see: function getSelectedRadioButtonIndex in example: http://codingforums.com/showthread.php?t=68139
    rm -f /

  • #4
    Regular Coder
    Join Date
    Sep 2005
    Posts
    535
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Also see this for other options in getting the checked radio-button's value...

    Also if there is one button that you are specifically checking for, for example:
    o Yes, I have read the terms
    o No, I do not accept the terms
    and you wish to make sure the person clicks 'Yes' before proceeding, then give each button a different ID. The name can still be the same so that it gets passed by submit(), but with different id's you can check:
    Code:
    if (document.getElementById('yesButton').checked) proceed();

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

    Smile Final Solution

    This is what I created. The "if (fieldRequired[i] == "grpType")" block looks pretty ugly. If there is a more efficient way let me know. Thanks for all the replies.

    Code:
    function checkForm(formobj){
    	
    	// Enter name of mandatory fields
    	var fieldRequired = Array("tmonth", "tday", "tyear", "tourtime", "FirstName", "LastName", "Address", "City", "State", "ZIP", "Phone", "Email", "grpName", "grpPhone", "grpNumber", "grpType");
    	
    	// Enter field description to appear in the dialog box
    	var fieldDescription = Array("Month", "Day", "Year", "Time", "First Name", "Last Name", "Address", "City", "State", "Zip Code", "Phone Number", "Email Address", "Group Name", "Group Phone", "Number in Group", "Group Type");
    	
    	// dialog message
    	var alertMsg = "Please complete the following fields:\n";
    
    	var l_Msg = alertMsg.length;
    
    	
    	for (var i = 0; i < fieldRequired.length; i++){
    		var obj = formobj.elements[fieldRequired[i]];
    		
    		if (fieldRequired[i] == "grpType")
    		{
    			for (index = 0; index < document.DailyVisit.grpType.length; index++)
    			{
    				if (document.DailyVisit.grpType[index].checked)
        			  	{
    					var groupChecked = document.DailyVisit.grpType[index].value;
    					if (groupChecked == "School")
    					{
    						if (document.DailyVisit.gradekto6.value != parseInt(document.DailyVisit.gradekto6.value))
    						{
    						alert("Grades K-6 must be a number.");
    						return false;
    						}
    						if (document.DailyVisit.grade7to8.value != parseInt(document.DailyVisit.grade7to8.value))
    						{
    						alert("Grades 7-8 must be a number.");
    						return false;
    						}
    						if (document.DailyVisit.grade9.value != parseInt(document.DailyVisit.grade9.value))
    						{
    						alert("Grade 9 must be a number.");
    						return false;
    						}
    						if (document.DailyVisit.grade10.value != parseInt(document.DailyVisit.grade10.value))
    						{
    						alert("Grade 10 must be a number.");
    						return false;
    						}
    						if (document.DailyVisit.grade11.value != parseInt(document.DailyVisit.grade11.value))
    						{
    						alert("Grade 11 must be a number.");
    						return false;
    						}
    						if (document.DailyVisit.grade12.value != parseInt(document.DailyVisit.grade12.value))
    						{
    						alert("Grade 12 must be a number.");
    						return false;
    						}
    
    					}
    				}
    			}
    		}
    		
    		
    		if (obj){
    			switch(obj.type){
    			case "select-one":
    				if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			case "select-multiple":
    				if (obj.selectedIndex == -1){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			case "text":
    			case "textarea":
    				if (obj.value == "" || obj.value == null){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    				break;
    			default:
    			}
    			if (obj.type == undefined){
    				var blnchecked = false;
    				for (var j = 0; j < obj.length; j++){
    					if (obj[j].checked){
    						blnchecked = true;
    					}
    				}
    				if (!blnchecked){
    					alertMsg += " - " + fieldDescription[i] + "\n";
    				}
    			}
    		}
    	}
    
    	if (alertMsg.length == l_Msg){
    		return true;
    	}else{
    		alert(alertMsg);
    		return false;
    	}
    }


  •  

    Posting Permissions

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