Showing posts with label Odd and Even Number Checker in JQuery. Show all posts
Showing posts with label Odd and Even Number Checker in JQuery. Show all posts

Thursday, October 15, 2015

Odd and Even Number Checker in JQuery

This simple program that I wrote will check if the number given by the user is Odd or Even number using JQuery. The code is very short and easy to understand I hope you will find my work useful in your learning in JQuery programming.

If you  have some questions please send me an email at jake.r.pomperada@gmail.com and jakerpomperada@yahoo.com. My mobile number here in the Philippines is 09173084360.



Program Listing

<html>
<head>
<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 </head>
 <style>
 h3 {
  font-family:arial;
  color:green;
  }
  </style>
<body>
<script language="javascript" type="text/javascript">
function  check_odd_even(val) 
   {
     var number = parseInt(val);

if ( number % 2 == 0 ){
         alert(number + " is an even number.");
}
          else {
          alert(number + " is an odd number.");
         }
}

$(document).ready(function () {
  value_number = parseInt(prompt("Enter a number"));
   check_odd_even(value_number);
  });
</script>
 </body>
</html>

Saturday, May 30, 2015

Odd and Even Number Checker in JQuery

A program that I wrote using JQuery to check if the number given by the user is odd or even number I also included data validation.  I hope anyone will be benefit in this simple program.

If you have some questions please send me an email at jakerpomperada@gmail.com and jakerpomperada@yahoo.com. People here in the Philippines can reach me at this number 09173084360.







Sample Program Output

Program Listing 

<html>
<title> Odd or Even Number Checker in JQuery</title>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 

    <script>
    $(document).ready(function(){

    function check_even_numbers(val)
    {
     return (val%2 == 0);
     }

    $("#number").focus();
    
    $("#check").click(function(){
        
        var item_no1 = $("#number").val();
      
    
        if (item_no1==0) {
            alert("Text field cannot be empty.");
            $("#number").focus();
        }
  
        else  if (/^[a-zA-Z0-9- ]*$/.test(item_no1) == false) {

          alert('Sorry it Contains Illegal Characters.');
          $("#number").focus();    
    }    
  
        else if (isNaN(item_no1))
        {
           alert("It is not a number but a letter(s) or alphabets.");
            $("#number").focus();    
            }
        
    else if (check_even_numbers(item_no1)) {              
                
      $('.display').html(item_no1 + " is an Even Number.");
    }
   else {
        $('.display').html(item_no1 + " is an Odd Number.");        
    }
});

// function to clear all the content of the text field

   $("#clear").click(function(){
          
           $(".display").html("");    
           $("#number").val(""); 
           $("#number").focus();
                  
    });

});

</script>

<style>

body {  
        background:lightgreen;
        color: blue ;
        font-family:arial;
        font-weight:bold;
        size:12;
     }
</style>


</head>
<body>
    <hr size="3" color="red">
<h2> Odd and Even Number Checker in JQuery </h2>
    <hr size="3" color="red">
<br><br>
Kindly enter a number :
<input type="text" id="number"  name="number" maxlength="5" size="5">
<br><br>
<button id="check" type="button" title="Click here to find if the number is odd or even ."> Check Number </button>
&nbsp;&nbsp;&nbsp;
<button id="clear" type="button" title="Click clear text box"> Clear </button>
<br><br><br>
<div class="display"></div>
</body>
</html>