Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: Alert boxes

  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Alert boxes

    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
    Code:
    <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:&nbsp;&nbsp;
          <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>

  • #2
    Banned
    Join Date
    Nov 2008
    Location
    not found
    Posts
    284
    Thanks
    0
    Thanked 53 Times in 51 Posts
    Code:
    if ((int)$num > 12 || $num < 1)
    Typecasting isn't supported in JS and in any case there's no int type and even in the right language, typecasting in the way you're trying to use it has no effect on the variable's type.

    Assuming that the input is known to be a number:
    Code:
    var n;
    
    if( (n=parseInt(&num)) > 12 || n < 1 )
     ...

  • #3
    New Coder
    Join Date
    Feb 2009
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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...
    Code:
          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.

  • #4
    Banned
    Join Date
    Nov 2008
    Location
    not found
    Posts
    284
    Thanks
    0
    Thanked 53 Times in 51 Posts
    Quote Originally Posted by Andrew025 View Post
    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.
    It looks like I misinterpreted the your code, but the problem in the original listing was

    Code:
    if (num < 1 || num > 12)
    which is saying it's OK for num to be more than 12 or less than 1.

    Use: if (num <= 12 && num >= 1)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •