#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    10
    Rep Power
    0

    Need some help with Javascript


    I have a survey form that will validate using to see if data is entered into textboxes. I also have a group of checkboxes that if the last checkbox is checked, no others can be. I will post my Javascript code and the HTML code for the checkboxes. Let me know what i'm doing wrong.

    <script type="text/javascript">
    function status() {
    the_form = document.getElementById('my_form');
    for (i = 0; i < the_form.elements.length; i++) {
    the_element = the_form.elements[i];
    if(the_element.type == 'checkbox' && the_element.checked == true) {
    return true;
    }
    }
    return false;
    }

    function CheckNone() {
    the_form = document.getElementById('my_form');
    the_element = the_form.elements[0];
    alert('sadf');
    if(the_element.type == 'checkbox' && the_element.checked == true) {
    strNone = true;
    return true;
    else
    {
    return false;
    }
    }

    return false;
    }

    function CheckOthers() {
    the_form = document.getElementById('my_form');
    for (i = 1; i < the_form.elements.length; i++) {
    the_element = the_form.elements[i];
    if(the_element.type == 'checkbox' && the_element.checked == true) {
    strOther = true;
    return true;
    }
    }
    return false;
    }

    function Compare() {
    if (strNone == true && strOther == true) {
    return false;
    }
    }



    function Validate(inform) {

    CheckNone();
    CheckOthers();
    if(!Compare()) {
    alert('If you do not have service with us, only check the NO SERVICE checkbox.');
    return false;
    }
    if (document.Survey.NameFirst.value == '') {
    alert('Please Enter your first name.');
    document.Survey.NameFirst.focus();
    return false;
    }
    if (document.Survey.NameLast.value == '') {
    alert('Please Enter your last name.');
    document.Survey.NameLast.focus();
    return false;
    }
    if (document.Survey.HomePhone.value == "") {
    alert("Please Enter your home phone number.");
    document.Survey.HomePhone.focus();
    return false;
    }
    if(!status()) {
    alert('Please check at least one Checkbox.');
    return false;
    }


    }


    </script>
    </head>

    <body style="background:#ffffff;">
    <form Name = "Survey" METHOD="POST" ACTION="NewEntry.asp" onsubmit="return Validate(this)" id="my_form">

    <div align=center><font color=black>
    <b>Welcome to the Citizen's Communications Survey!<br>
    Please fill out this quick and easy survey to enhance our service that we provide to you.</b><br></div>
    <TABLE WIDTH=590 BORDER=0 CELLPADDING=3 CELLSPACING=0 ALIGN=CENTER>
    <TR>
    <TD ALIGN=CENTER BGCOLOR=#FFffff COLSPAN=2>
    <TABLE BORDER=0 CELLPADDING=5 CELLSPACING=0>
    <TR>
    <TD ALIGN=RIGHT colspan="2">
    <p align="center"><font color="#FF0000">*</font><font color="#000000">Required
    Fields</font></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><font color="#FF0000">*</font><FONT FACE=ARIAL SIZE=2>First Name:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="NameFirst" SIZE="25"></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><font color="#FF0000">*</font>Last Name:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="NameLast" SIZE="25"></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT VALIGN=TOP><FONT FACE=ARIAL SIZE=2>Address:</FONT><BR></TD>
    <TD ALIGN=LEFT><TEXTAREA NAME="Address" ROWS="2" COLS="30"></TEXTAREA></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><FONT FACE=ARIAL SIZE=2>City:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="City" SIZE="20"></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><FONT FACE=ARIAL SIZE=2>State:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="State" SIZE="2"> &nbsp <FONT FACE=ARIAL SIZE=2>Zip Code:&nbsp;&nbsp;</FONT><INPUT TYPE=TEXT NAME="Zip" SIZE="9"></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><font face=arial size=2 color=black>E-mail Address:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="Email" SIZE="30"></TD>
    </TR>
    <TR>
    <TD ALIGN=RIGHT><font color="#FF0000">*</font>Home/Contact Phone:</FONT></TD>
    <TD ALIGN=LEFT><INPUT TYPE=TEXT NAME="HomePhone" SIZE="20"></TD>
    </TR>
    <TR>
    <TD Align=center colspan=2><Font color=red>*</font><font color=black>Please check all Services that Citizens is providing you:</td>
    </tr>
    <TR>
    <TD></TD>
    <td align=left><input type="checkbox" name="1" value="1">Citizens Telephone</TD>
    </TR>
    <TR>
    <TD></TD>
    <TD align=left><input type="checkbox" name="2" value="1">Citizens Long Distance</TD>
    </TR>
    <TR>
    <TD></TD>
    <TD align=left><input type="checkbox" name="3" value="1">Citizens Cable</TD>
    </TR>
    <TR>
    <TD></TD>
    <TD align=left><input type="checkbox" name="4" value="1">Citizens Internet Services</TD>
    </TR>
    <TR>
    <TD></TD>
    <TD align=left><input type="checkbox" name="0" value="1">None</TD>
    </TR>
    <TR>
    <TD ALIGN=CENTER COLSPAN=2>
    <BR>
    <Button name="btnsubmit" type="submit" size="20">Next Page -></Button>
    <BR><BR>
    </TD>
    </TR>
    </TABLE>
  2. #2
  3. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    7
    Rep Power
    0
    Please try to name your thread appropriately, use the code blocks, and be more specific about your problem.

    If you replace your script section with the following, it will uncheck the other checkboxes if you click none, and it will uncheck none if you click any of the other boxes.
    Code:
    <script type="text/javascript"> 
    	function status() 
    	{ 
    		the_form = document.getElementById('my_form'); 
    		for (i = 0; i < the_form.elements.length; i++) 
    		{ 
    			the_element = the_form.elements[i]; 
    			if(the_element.type == 'checkbox' && the_element.checked == true) 
    			{ 
    				return true; 
    			} 
    		} 
    		return false; 
    	} 
    	function Compare()
    	{ 
    		if (strNone == true && strOther == true) 
    		{ 
    			return false; 
    		} 
    	} 
    
    	function Validate(inform) 
    	{ 
    		if (document.Survey.NameFirst.value == '')
    		{ 
    			alert('Please Enter your first name.'); 
    			document.Survey.NameFirst.focus(); 
    			return false; 
    		} 
    		if (document.Survey.NameLast.value == '')
    		{ 
    			alert('Please Enter your last name.'); 
    			document.Survey.NameLast.focus(); 
    			return false; 
    		} 
    		if (document.Survey.HomePhone.value == "") 
    		{ 
    			alert("Please Enter your home phone number."); 
    			document.Survey.HomePhone.focus(); 
    			return false; 
    		} 
    		if(!status()) 
    		{ 
    			alert('Please check at least one Checkbox.'); 
    			return false; 
    		} 
    	} 
    	function clickOther()
    	{
    		var cbNone = document.getElementById("cbNone");
    		if (cbNone.checked = true)
    			cbNone.checked = false;
    	}
    	function clickNone()
    	{
    		var the_form = document.getElementById("my_form");
    		for( var i = 0; i < the_form.elements.length; i++)
    		{
    			var element = the_form.elements[i];
    			if (element.type == "checkbox" && element.name != "0")
    			{
    				element.checked = false;
    			}
    		}
    	}
    I hope you use a little more validation than this (eg. reg expression on the phone num).
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    10
    Rep Power
    0
    Didn't work. It didn't give me an error but it didn't uncheck all the other checkboxes when i checked none. Also, i took out the function Compare:

    function Compare()
    {
    if (strNone == true && strOther == true)
    {
    return false;
    }
    }

    Should i leave that in?

    PS. thanks for helping me out.
  6. #4
  7. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    7
    Rep Power
    0
    Code:
    var cbNone = document.getElementById("cbNone");
    That line should read

    Code:
    var cbNone = document.getElementByName("0");
    I forgot that I had changed the html a little bit.

    I don't think you need the compare function anymore.

IMN logo majestic logo threadwatch logo seochat tools logo