Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 216
  • Last Modified:

How to Make the checkbox required field

Hello
I am trying to make the checkbox required field and once the checkbox is selected and click on the submit button it should pop up a confirmation message and I select No it should take to a different page. How can I do this?
<script type="text/javascript">

	function blockError(){return true;}
	window.onerror = blockError;


var strAlertMsg = ""
var focusField = ""
 
 function hasChecked(theForm,strFieldName,strMsg) 
 {
	      var objFormField = theForm.elements[strFieldName]
          intControlLength = objFormField.length
          bolSelected = false;
          for (i=0;i>intControlLength;i++){
          if(objFormField[i].checked){
          bolSelected = true;
          break;
          }
     }
     if(! bolSelected){
          strAlertMsg += "- "+ strMsg +" is Required.\n";
          return false;
          }
     return true;
}

//Begin Page Validation
function validateForm(theForm){
strAlertMsg = ""
focusField = ""
   
	  	
			hasChecked(theForm,'NameCorrect','Checkbox')

 if(strAlertMsg !=""){
          alert("Mandatory Entry Missing:\n____________________________\n\n" + strAlertMsg);
          eval("theForm." + focusField + ".focus()");
        return false;
    }
    return true;
}


</script>
<form title="InputForm" id="InputForm" name="sampleform" method="post" onsubmit="return validateForm(this)">      
<INPUT type='checkbox' name='NameCorrect'>
<input type="submit" value="Submit" >
</form>

Open in new window

0
csaexperts
Asked:
csaexperts
  • 5
  • 2
2 Solutions
 
Michel PlungjanIT ExpertCommented:
Comment out the onerror and tell us the error you get
0
 
Michel PlungjanIT ExpertCommented:
You did not set the field to focus - also never use eval if not necessary
<script type="text/javascript">

var strAlertMsg = ""
var focusField = ""
 
 function hasChecked(theForm,strFieldName,strMsg) 
 {
	      var objFormField = theForm.elements[strFieldName]
          intControlLength = objFormField.length
          bolSelected = false;
          for (i=0;i>intControlLength;i++){
          if(objFormField[i].checked){
          bolSelected = true;
          break;
          }
     }
     if(! bolSelected){
          strAlertMsg += "- "+ strMsg +" is Required.\n";
          return false;
          }
     return true;
}

//Begin Page Validation
function validateForm(theForm){
strAlertMsg = ""
focusField = 'NameCorrect'
   
	  	
			hasChecked(theForm,'NameCorrect','Checkbox')

 if(strAlertMsg !=""){
          alert("Mandatory Entry Missing:\n____________________________\n\n" + strAlertMsg);
          theForm.elements[focusField].focus();
        return false;
    }
    return true;
}


</script>
<form title="InputForm" id="InputForm" name="sampleform" method="post" onsubmit="return validateForm(this)">      
<INPUT type='checkbox' name='NameCorrect'>
<input type="submit" value="Submit" >
</form>

Open in new window

0
 
BurniePCommented:
Hi,

I have simplified your code that does what you are trying to do.

It checks that the checkbox is checked, and if yes, it ask a confirmation to continue :
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<script type="text/javascript">
  function blockError() { return true; }
  window.onerror = blockError;

  //Begin Page Validation
  function validateForm() {
    var chk = document.getElementById("chkNameCorrect");
    if (!chk.checked) {
      alert("Checkbox is required");
      return false;
    }
    if (!confirm("Confirm to continue?")) {
      window.location = "YourRedirectionPage.html";
    }
  }
</script>
</head>
<body>
<form title="InputForm" id="InputForm" name="sampleform" method="post" onsubmit="return validateForm()">      
<input id="chkNameCorrect" type='checkbox' name='NameCorrect'/>
<input type="submit" value="Submit" />
</form>
  </body>
</html>

Open in new window

0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
Michel PlungjanIT ExpertCommented:
That is of course assuming that that is the only thing needed to be validated. I just fixed the existing code which is ok and reusable.
0
 
Michel PlungjanIT ExpertCommented:
0
 
csaexpertsAuthor Commented:
Thanks BurnieP for the help, your code works fine but I am still not able to redirect the page if I click on the cancel button (on the cofirmation popup).
0
 
Michel PlungjanIT ExpertCommented:
Sorry I only read half your question

Here is tested code
<script type="text/javascript">

var strAlertMsg = ""
var focusField = ""
function hasChecked(objFormField) {
  var intControlLength = objFormField.length;
  if (intControlLength==null) return objFormField.checked; // only one
  for (i=0;i>intControlLength;i++) if(objFormField[i].checked) return true;
  return false;
}

//Begin Page Validation
function validateForm(theForm){
  var strAlertMsg = ""
  var focusField = 'NameCorrect'
  if (!hasChecked(theForm.NameCorrect)) strAlertMsg = "NameCorrect is mandatory";

  if(strAlertMsg !=""){
    alert("Mandatory Entry Missing:\n____________________________\n\n" + strAlertMsg);
    var fieldToFocus = theForm.elements[focusField];
    if (fieldToFocus.length ==null) fieldToFocus.focus();
    else fieldToFocus[0].focus();
    return false;
  }
  var answer = confirm("Your entries are valid, do you wish to continue");
  if (answer) return true;
  else location="someotherpage.html";
  return false; // cancel submission
}


</script>
<form title="InputForm" id="InputForm" name="sampleform" method="post" onsubmit="return validateForm(this)">      
<INPUT type='checkbox' name='NameCorrect'>
<input type="submit" value="Submit" >
</form>

Open in new window

0
 
csaexpertsAuthor Commented:
Thanks mplungjan, It worked perfectly fine but I also liked BurnieP simplified code which is really easy to understand. So I am going to distribute the points to both of you.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 5
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now