Hey Everyone! It's 6:29pm EST and I have been working on this same problem since about 9am. I'm usually able to Google my way to the solution- but I have reworded my search numerous times and went through mountains of forums trying different approaches but to no avail. Here is what I have...

Main.php
A webpage with three disclaimers that have to be read. Each disclaimer is presented in an iFrame- and each disclaimer has a checkbox below it that must be checked in order to move forward. Here is the form code on this page...

<form action="DisclaimProcess.php" method="POST">				  			  
<iframe width="560" height="315" src="DisclaimerPage1.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim1" required /> Checking the box is my electronic signature, and the equivalent of my handwritten signature, in acknowledgment of the above.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="DisclaimerPage2" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim2" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="DisclaimerPage3" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim3" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br />
			  
<input type="submit" name="submit" value="Continue" />
</form>

Now in Firefox and Google Chrome- this works great by itself because the "required" inside the 'input tag' will not let you continue unless they are checked- but in Internet Explorer (which is why this has taken me longer than 1 hour to figure out) it let's you continue to the next page no matter what is checked. Anyways...

DisclaimProcess.php
This is the page that processes the form to make sure all checkboxes are checked. What it SHOULD do is if all checkboxes are checked then load the next page. If any of the checkboxes are not checked then it should send them back to the Main.php with the alert that they must check all checkboxes to continue. Now the code below is a broken example of what I would like it to do- I've never had any code fragments work correctly today so this will hopefully give you enough info.

<?php

$Disclaim1 = $_POST['Disclaim1'];
$Disclaim2 = $_POST['Disclaim2'];
$Disclaim3 = $_POST['Disclaim3'];


echo($Disclaim1);	
$total = 0;
if(isset($Disclaim1)
$total =$total+1;


if(isset($Disclaim2);
$total =$total+1;


if(isset($Disclaim3);
$total =$total+1;


if($total!=3)
{
echo("USE MUST CHECK ALL BOXES TO CONTINUE")
	include ('main.php');
}

else
{
header("Location: yay.htm");
}

?>

Thank you so much in advance for your help... I'm going home.

Recommended Answers

All 6 Replies

Member Avatar for diafol

IE will always find a way of kicking you in the old crown jewels. :(

Anyway. Do you really need iframes? How about using include()? You can place it in a sized container (div) and set the overflow to enable scrollbars for it.

You can use a js script to prevent form submission if all 3 not checked. Have a look at jQuery form validators. Or a simple one I've used in the past is YAV (http://yav.sourceforge.net/).

Thanks for the assistance. Ok- I'm back this morning ready to tackle this problem. However, I still must be doing something wrong. Here is what I have now.

I've uploaded the 'js_compact" folder from the 'yav2_0' library; that's all I need out of that right?

Here is what I now have...

Main.php
Between the 'HEAD' tags I have this...

<head>
<script src="/js_compact/yav.js"></script>
<script src="/js_compact/yav-config.js"></script>

<script language="javascript" type="text/javascript">
    var rules=new Array();
    rules[0]='Disclaim1|required';
    rules[1]='Disclaim2|required';
	rules[2]='Disclaim3|required';
</script>
</head>

And my form on the same page contains this...

<form name="DisclaimVal" method="POST" id="DisclaimVal" action="/job12.htm" onsubmit="return performCheck('DisclaimVal', rules);">			  			  
<iframe width="560" height="315" src="DisclaimPage1.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim1" id="Disclaim1" required /> Checking the box is my electronic signature, and the equivalent of my handwritten signature, in acknowledgment of the above.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="DisclaimPage2.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim2" id="Disclaim2" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="DisclaimPage3" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim3" id="Disclaim3" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br />
			  
<input type="submit" name="submit" value="Continue" />
</form>

Internet Explorer is still sending the client on their merry way whether they check all the checkboxes or not- it doesn't care it will let anyone pass. I need a Gandalf validation here- "YOU SHALL NOT PASS!... until you check all the checkboxes.."

Thanks again for your help on this problem.

Add this code to header

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=3.3'></script>
<script type="text/javascript">
            /* <![CDATA[ */
            jQuery(function(){
                jQuery("checkbox").validate({
                    expression: "if (isChecked(SelfID)) return true; else return false;",
                    message: "Please check all checkboxs"
                });
            });
            /* ]]> */
        </script>

it should work !

Internet Explorer still let's you continue to next page without checking the boxes. Here is what I have now.

Main.php
In the header...

<head>
<script src="/js_compact/yav.js"></script>
<script src="/js_compact/yav-config.js"></script>

<script language="javascript" type="text/javascript">
    var rules=new Array();
    rules[0]='Disclaim1|required';
    rules[1]='Disclaim2|required';
	rules[2]='Disclaim3|required';
</script>


    <script type='text/javascript' src='/js_compact/jquery.min.js'></script>
    <script type="text/javascript">
    /* <![CDATA[ */
    jQuery(function(){
    jQuery("checkbox").validate({
    expression: "if (isChecked(SelfID)) return true; else return false;",
    message: "Please check all checkboxs"
    });
    });
    /* ]]> */
    </script>
</head>

And the form code in the body...

<form name="DisclaimVal" method="POST" id="DisclaimVal" action="/job12.htm" onsubmit="return performCheck('DisclaimVal', rules);">			  			  
<iframe width="560" height="315" src="http://InsertURIDisclaimPage1.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim1" id="Disclaim1" required /> Checking the box is my electronic signature, and the equivalent of my handwritten signature, in acknowledgment of the above.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="http://InsertURIDisclaimPage2.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim2" id="Disclaim2" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="http://InsertURIDisclaimPage3.html" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim3" id="Disclaim3" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br />
			  
<input type="submit" name="submit" value="Continue" />
</form>
Member Avatar for diafol

YAV looks a little dated now I must admit, but still works.
jQuery is flavour of the last couple of years, and you may find better validate plugins.

AFAIK - jQuery doesn't have a native .validate() - it needs something this plug-in:

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Mind you, it's not something I've checked recently.

**DON'T USE Yav and jQuery together**

Thank all of you guys so much! I wouldn't have found the answer to the problem without your combined efforts and time and it is very much appreciated. I still loathe Internet Explorer but at least it's working. I just got my copy of jQuery in Action (2nd Edition), so I'm sure I will find a way to simplify the script a lot- I am very detailed and sometimes need more explanation then just snippets of code to solve my issue so I'm going to give a detailed breakdown of my solution below- and hopefully it will help someone else solve a similar issue.

Now for Firefox and Chrome- the requirement to have all checkboxes checked is solved with the 'required' attribute being inside each 'input' tag, but for Internet Explorer something else must be done and this is what I have.

The answers I received here led me to http://jetlogs.org/2008/08/19/jquery-multiple-checkbox-validation/
which is where I got some of the code snippets to solve this problem.

Problem
I had 3 checkboxes that I needed to be required before proceeding to the next page. Above each checkbox was an iFrame with another page that had the disclaimer they were agreeing to.

Pages or Documents Needed

  • FormPage.php (This is where the form resides)

The script file you will need to upload from this zip file is jquery-1.2.6.pack.js

  • ProcessForm.php (This is what checks to make sure all checkboxes are checked for Internet Explorer)
  • Completed.html (This is where the page goes after all pages are complete)

*Note*
This is client side, so if anyone really wants to not have to check the boxes- they could view source on the 'DisclaimProcess.php' page and see where the code takes them if they had checked the boxes. My situation didn't call for that amount of strictness.

FormPage.php

In between the HEAD tags put the following

<head><script type="text/javascript" src="jquery-1.2.6.pack.js"></script>
<script type="text/javascript">
		$(document).ready(function()
		{
			$("form").submit(function()
			{
				if (!isCheckedById("Disclaim1"))
				{
					alert ("All boxes must be checked");
					return false;
				}				
				else if (!isCheckedById("Disclaim2"))
				{
					alert ("All boxes must be checked");
					return false;
				}
				else if (!isCheckedById("Disclaim3"))
				{
					alert ("All boxes must be checked");
					return false;
				}
				else
				{
					return true; //submit the form
				}				
			});
			
			function isCheckedById(id)
			{
				var checked = $("input[@id="+id+"]:checked").length;
				if (checked == 0)
				{
					return false;
				}
				else
				{
					return true;
				}
			}
		});
		</script>
</head>

The 'Disclaim1', 'Disclaim2', and 'Disclaim3' are the names of my checkboxes- you can rename these to fit your form and add more 'else if' statements to add more.
And of course the file location for the "jquery-1.2.6.pack.js" file may be in a different location on your server.

In between the BODY tags put the following for the form...

<form method="POST" action="ProcessForm.php">			  			  
<iframe width="560" height="315" src="http://WhatEverPageDisclaimOneIsOn.com/Disclaim1.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim1" id="Disclaim1" value="Disclaim1" required /> Checking the box is my electronic signature, and the equivalent of my handwritten signature, in acknowledgment of the above.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="http://www.WhatEverPageDisclaimTwoIsOn.com/Disclaim2.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim2" id="Disclaim2" value="Disclaim2" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br/><br/>

<iframe width="560" height="315" src="http://WhatEverPageDisclaimThreeIsOn.com/Disclaim3.php" frameborder="1"></iframe>
<P align="justify" font-size: "12px" style="color:red"><strong>
<input type="checkbox" name="Disclaim3" id="Disclaim3" value="Disclaim3" required /> By checking the box I acknowledge I have read and understand the above information.
<br /></p></strong><br />
			  
<input type="submit" id="submit_prog" value="Continue" />
</form>

Simple Version
I put all of the code above that I had for my needs, but the simple syntax of the above would just be...

<form method="POST" action="ProcessForm.php">
<input type="checkbox" name="Disclaim1" id="Disclaim1" value="Disclaim1" required />Some text describing checkbox 1 here
<input type="checkbox" name="Disclaim2" id="Disclaim2" value="Disclaim2" required />Some text describing checkbox 2 here
<input type="checkbox" name="Disclaim3" id="Disclaim3" value="Disclaim3" required />Some text describing checkbox 3 here
<input type="submit" id="submit_prog" value="Continue" />

ProcessForm.php

<?php
$Disclaim1 	= '';
$Disclaim2 	= '';
$Disclaim3 	= '';

if (isset($_POST['Disclaim1']) && isset($_POST['Disclaim2']) && isset($_POST['Disclaim3']))
{
	header("Location: Completed.html");
	$Disclaim1 	= htmlentities(implode(', ', $_POST['Disclaim1']));
	$Disclaim2	= htmlentities(implode(', ', $_POST['Disclaim2']));
	$Disclaim3 	= htmlentities(implode(', ', $_POST['Disclaim3']));
}
?>
<html>
	<head></head>
	<body>
		All checkboxes must be checked, agreeing with all disclaimers and information, in order to proceed.<br>
		Please <a href="/FormPage.php">CLICK HERE</a> to go back and complete all checkboxes in order to continue.
	</body>
</html>

If you have more checkboxes than three you will need to add more 'isset' attributes to the 'if' statement to validate all checkboxes. You don't really need the above sections that have this code...

$Disclaim3 	= htmlentities(implode(', ', $_POST['Disclaim3']));

I was just lazy and didn't remove it from the example code I downloaded.

This section...

{
header("Location: Completed.html");
}

is what sends the client to the next page. It is nested inside the 'if' statement.

I hope this information helps someone else that has this same issue. I know what i have done is probably a slight overkill and there is a simpler version which I will figure out later but this fit my immediate need for now.
I have the best C++, jQuery, PHP, MySQL and other books- but I read enough of them to solve my issue or to get me in trouble. It's a combination of my ADHD, OCD and Hyper-manicness (new word!) that helps me and hurts me to my solutions I get- so you professional coders go easy on me. I need to spend more time developing my skills but this has been a fun exercise.

Big Thanks Again To Everyone Who Helped!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.