Alert boxes [Archive] - CodingForums.com

Andrew025

05-19-2009, 08:28 PM

I basically need client side validation. An alert box is supposed to pop up before data is sent to the server if something is wrong. If I enter "a" an alert box will pop up saying it's invalid, the only part that doesn't work is the part where it needs to be 1-12, a pop up box won't come up if the data there is wrong.
Here's the code
scroll about half way down and look for my comment

<title>Times Table</title>
<?php
function timesGrid($num)
{
$row = 1;
$ans = 0;
$col = 1;
echo "<table border='1'>";
while($row <= $num)
{
echo "<tr>";
while($col <= $num)
{
$ans = $row * $col;
echo "<td align='right'>$ans</td>";
$col ++;
}
$col = 1;
$row++;
echo "</tr>";
}
echo "</table>";
}
$num = "";
if (count($_POST) > 0 && !empty($_POST["times"]))
{
$num = $_POST["times"];
}

function isValid($num, &$errorMessage)
{
$valid = true;
if (empty($num))
{
$valid = false;
$errorMessage = "This field is required!";
return $valid;
}

if (!is_numeric($num))
{
$valid = false;
$errorMessage = "You must enter a number.";
return $valid;
}

if (intval($num) != $num)
{
$valid = false;
$errorMessage = "You must enter an integer.";
return $valid;
}
if ((int)$num > 12 || $num < 1)
{
$valid = false;
$errorMessage = "This function only works for integers that are within the range of 1-12";
return $valid;
}

return $valid;

}
$num = "";
$errorMessage = "";

if (count ($_POST) > 0)
{
$num = $_POST["num"];
if (isValid($num, $errorMessage))
{
if (timesGrid($num))
$timesGrid = "Yes";
else
$timesGrid = "No";
}
}
?>
<html>
<head>
<script type="text/javascript">
function filled_out(id)
{
var control = document.getElementById(id);
var str = control.value;

if (str == "" || str.length == 0)
{
alert(control.id + " must be provided.");
control.focus();
return false;
}
return true;
}

function isInteger(id)
{
var control = document.getElementById(id);
var num = parseInt(control.value);
if (num == control.value)
return true;
else
{
alert(control.id + " must be an integer.");
control.focus();
return false;
}
}

//This is the part I think something is wrong
function isValid()
{
if (filled_out("num"))
{
if (isInteger("num"))
{
var control = document.getElementById("num");
var num = parseInt(control.value);
if (num < 12 || num > 1)
{
return true;
}
else
{
alert(control.id + " must be between 1-12.");
control.focus();
return false;
}
}
else
{
return false;
}
}
else
{
return false;
}
}

var requiredFields = new Array("num");

function filled_out2(requiredFields)
{
for (var i = 0; i < requiredFields.length; i++)
{
var control = document.getElementById(requiredFields[i]);
var strInput = control.value.trim();
if (strInput == "" || strInput.length == 0)
{
alert(requiredFields[i] + " must be provided");
control.focus();
return false;
}
}
return true;
}

</script>
</head>
<body>
<form id="timesForm" name="timesForm" method="post" action="timesGrid.php" onSubmit="return isValid();">
<p>Enter the number here:  
<input type="text" id="num" name="num"
value="<?php echo $num; ?>" />
<span style="color:red"><?php echo $errorMessage; ?></span>
<p>
<input type="submit" value="Show Times Chart" name="submit" />

</p>

</form>
</body>
</html>

Andrew025

05-19-2009, 11:11 PM

I'm not worried about the php part, it worked before I added the javascript to it. If I enter 1.2 I get the alert box that says it needs to be an integer.
I just can't pin point what's wrong with it.
If I change it to this...

function isValid()
{
if (filled_out("num"))
{
if (isInteger("num"))
{
var control = document.getElementById("num");
var num = parseInt(control.value);
if (num < 1 || num > 12)
{
return true;
}
else
{
alert(control.id + " must be between 1-12.");
control.focus();
return false;
}
}
else
{
return false;
}
}
else
{
return false;
}
}

I get the alert box to pop up, but that isn't right because if I enter "1" it is supposed to be valid.