[RESOLVED] Firefox help

[planethax]

Not sure if this is the right place to post this?

The following page works with IExplorer and Chrome, but not with Firefox.

User is to select exactly 7 drivers, but with Firefox, no matter how many drivers you select, even seven, you get the popup stating you must select 7 drivers.

Can anyone see what I have done wrong here?

Thanx.

<?php

$tpl = new template;
$tpl -> Load("!theme/{$GLOBALS["THEME"]}/templates/fantasy/fselteam.tpl");
$tpl -> GetObjects();


if (isset($_SESSION["id"])) $tpl->Zone("userStatus", "user");

	else $tpl->Zone("userStatus", "guest");

if (isset($GLOBALS["LOGIN_FAIL_TYPE"])) {
	if ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.password") $loginError = $GLOBALS["OBJ"]["loginError.password"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.user") $loginError = $GLOBALS["OBJ"]["loginError.username"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.bruteforce") $loginError = $GLOBALS["OBJ"]["loginError.bruteforce"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.active") $loginError = $GLOBALS["OBJ"]["loginError.active"];
}

$tpl -> AssignArray(array(
	"login.failMessage" => (isset($loginError)?$loginError:NULL)
));
// Report all PHP errors (see changelog)
// error_reporting(E_ALL);
include_once('db_conn.php');
$sql = "SELECT * FROM `nascar_standings` ORDER BY driver ASC LIMIT 65";
$rs = mysql_query($sql);
$user = "frank";
$i = 0;
$sel_text = "";
$column = "</tr><tr>";
$sel_text .= "<form name='frmChk' action='testsel1.php' method='post'>";
while($row = mysql_fetch_assoc($rs)){
  $label = $row['driver'];
  $sel_text .= "<td><input type='checkbox' name='chks[]'> $label </td>";
    if (++$i % 4 == 0)
    {
        $sel_text .= $column;
    }
}
$sel_text .= "</tr><tr><td colspan =4 valign = center><input type='submit' value='Validate & Submit' name='validate' onclick='if(!checkCount()) return false;'></form></td></tr></table>";

$sel_text .= "<script language='javascript'>
  function checkCount(){
   var count=0;
   var inputs=document.frmChk.getElementsByTagName('input');
   for(var i=0; i<inputs.length-1; i++){
     if(inputs[i].type == 'checkbox' && inputs[i].checked == true)
        count++;
   }
    if(count != 7){
        alert('You must select 7 Drivers');
        return false;
     }
     return true; 
 }
</script>";
$tpl -> AssignArray(array('selteam' => $sel_text));		
$tpl -> Flush();

?>

[Shrike]

Check which order your Javascript reads the form elements. I seem to remember it being different depending on the browser.

[planethax]

I am not sure,
I have tried putting the Javascript before the form, I have even removed it and put it in the Main header of page, just will not work for Firefox, IE and Chrome work though.

It must be something little I have missed, but just can not find it 🙁

[cahva]

Javascript can be placed inside head, althought speedwise javascript should be put right before ending body tag(atleast when you are loading script externally).

I didnt test your script so I dont exactly know what caused that behaviour. Couple of observations:
- dont use script language="javascript". Use type="text/javascript"
- define vars by their id as shown below.
- you have not set value to your checkboxes

Heres corrected javascript part:

<script type="text/javascript">

function checkCount(){
	var mincheck = 7;
	var testform = document.getElementById('frmChk');
	var items = testform.getElementsByTagName('input');
	var count = 0;

	for (var i=0; i < items.length-1; i++)
	{
		if (items[i].type == 'checkbox' && items[i].checked)
		{
			count++;
		}
	}

	if(count != mincheck)
	{
		alert('You must select ' + mincheck + ' Drivers');
		return false;
	}
	return true; 
}

</script>

EDIT: oh.. almost forgot. Give id="frmChk" to your form.

[planethax]

Hmmmm, thank you for your reply.

With your code, Firefox now ALWAYS proceeds whether I have 7 or not?

Still ok with IE and chrome though?

This is giving me a headache lol

[cahva]

Well it works for me. I use onsubmit on the form:

<form id="chkFrm" method="post" onsubmit="if (!checkCount()) return false;">

[planethax]

Here is my page now,
Still does not work with FF, now always proceeds whether I have 7 or not drivers selected.

<?php

$tpl = new template;
$tpl -> Load("!theme/{$GLOBALS["THEME"]}/templates/fantasy/fselteam.tpl");
$tpl -> GetObjects();


if (isset($_SESSION["id"])) $tpl->Zone("userStatus", "user");

	else $tpl->Zone("userStatus", "guest");

if (isset($GLOBALS["LOGIN_FAIL_TYPE"])) {
	if ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.password") $loginError = $GLOBALS["OBJ"]["loginError.password"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.user") $loginError = $GLOBALS["OBJ"]["loginError.username"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.bruteforce") $loginError = $GLOBALS["OBJ"]["loginError.bruteforce"];
	elseif ($GLOBALS["LOGIN_FAIL_TYPE"] == "e.active") $loginError = $GLOBALS["OBJ"]["loginError.active"];
}

$tpl -> AssignArray(array(
	"login.failMessage" => (isset($loginError)?$loginError:NULL)
));
// Report all PHP errors (see changelog)
// error_reporting(E_ALL);
include_once('db_conn.php');
$sql = "SELECT * FROM `nascar_standings` ORDER BY driver ASC LIMIT 65";
$rs = mysql_query($sql);
$user = "frank";
$i = 0;
$sel_text = "";
$column = "</tr><tr>";
$sel_text .= "<form id='chkFrm' action='testsel1.php' method='post' onsubmit='if (!checkCount()) return false;'>";
while($row = mysql_fetch_assoc($rs)){
  $label = $row['driver'];
  $sel_text .= "<td><input type='checkbox' name='chks[]'> $label </td>";
    if (++$i &#37; 4 == 0)
    {
        $sel_text .= $column;
    }
}
$sel_text .= "</tr><tr><td colspan =4 valign = center><input type='submit' value='Validate & Submit' name='validate' onclick='if(!checkCount()) return false;'></form></td></tr></table>";

$sel_text .= "<script type='text/javascript'>

function checkCount(){
	var mincheck = 7;
	var testform = document.getElementById('frmChk');
	var items = testform.getElementsByTagName('input');
	var count = 0;

	for (var i=0; i < items.length-1; i++)
	{
		if (items[i].type == 'checkbox' && items[i].checked)
		{
			count++;
		}
	}

	if(count != mincheck)
	{
		alert('You must select ' + mincheck + ' Drivers');
		return false;
	}
	return true; 
}

</script>";
$tpl -> AssignArray(array('selteam' => $sel_text));		
$tpl -> Flush();

?>

[cahva]

I couldnt say without seeing the actual html generated. If you can, post link to the page. Anyway, heres the whole test script that I made to test this out:

<?php

if (count($_POST) > 0)
{
	$content = '<pre>'.print_r($_POST,true).'</pre>';
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Test</title>
		<script type="text/javascript">
			<!--

		function checkCount(){
			var mincheck = 3;
			var testform = document.getElementById('chkFrm');
			var items = testform.getElementsByTagName('input');
			var count = 0;

			for (var i=0; i < items.length-1; i++)
			{
				if (items[i].type == 'checkbox' && items[i].checked)
				{
					count++;
				}
			}

			if(count != mincheck)
			{
    			alert('You must select ' + mincheck + ' Drivers');
    			return false;
 			}
 			return true; 
		}
		-->
	</script>
</head>
<body>
	<?php if (isset($content)): ?>
		<div id="content"><?php echo $content ?></div>
	<?php endif; ?>
	<form id="chkFrm" action="" method="post" onsubmit="if (!checkCount()) return false;">
		<input type="checkbox" name="chks[]" value="val1"/>
		<input type="checkbox" name="chks[]" value="val2"/>
		<input type="checkbox" name="chks[]" value="val3"/>
		<input type="checkbox" name="chks[]" value="val4"/>
		<input type="checkbox" name="chks[]" value="val5"/>
		<input type="submit" name="submit" />
	</form>
</body>
</html>

[planethax]

Here is where the page resides
http://www.mynascarspace.net/?L=fantasy.fselteam

thank you

[cahva]

You have an error in your page. I pasted the form tag with wrong id. form's id should be frmChk, not chkFrm

[planethax]

Geez, I shoulda caught that, I had typed it in originally but it kept erroring then I C/P and then would never error, figured it was not calling the check.

Ok, fixed that, but FF still not working, it still errors that I need 7 drivers even if I pick 7.

Page located at
http://www.mynascarspace.net/?L=fantasy.fselteam

(I cant post source as it is too long 🙁 )

[cahva]

Okay.. I know what causes that behaviour.

You have started your form after <tr> and that breaks it. I quess it messes up with the DOM and Firefox is slightly stricter with that. Start the form element outside the whole table so the output is generated something like this:

<form>
    <table>
        <tr>
            <td>...</td><td>...</td>
        </tr>
    </table>
</form>

[planethax]

WOW!!!! THANX CAHVA!!!

I would not in a million years figured that out.

Works!!!!

[cahva]

Glad to help 🙂 For the future you might want to validate the html to make sure it plays well on all browsers. This way you can rule out atleast the markup if you encounter errors in the future.