Showing posts with label javascript. Show all posts
Showing posts with label javascript. Show all posts

Tuesday, September 18, 2012

Phone Number Validation



Phone Number Validation


<html>

<script language = "Javascript">
/**
 * DHTML phone number validation script. Courtesy of SmartWebby.com (http://www.smartwebby.com/dhtml/)
 */

// Declaring required variables
var digits = "0123456789";
// non-digit characters which are allowed in phone numbers
var phoneNumberDelimiters = "()- ";
// characters which are allowed in international phone numbers
// (a leading + is OK)
var validWorldPhoneChars = phoneNumberDelimiters + "+";
// Minimum no of digits in an international phone no.
var minDigitsInIPhoneNumber = 10;

function isInteger(s)
{   var i;
    for (i = 0; i < s.length; i++)
    {   
        // Check that current character is number.
        var c = s.charAt(i);
        if (((c < "0") || (c > "9"))) return false;
    }
    // All characters are numbers.
    return true;
}
function trim(s)
{   var i;
    var returnString = "";
    // Search through string's characters one by one.
    // If character is not a whitespace, append to returnString.
    for (i = 0; i < s.length; i++)
    {   
        // Check that current character isn't whitespace.
        var c = s.charAt(i);
        if (c != " ") returnString += c;
    }
    return returnString;
}
function stripCharsInBag(s, bag)
{   var i;
    var returnString = "";
    // Search through string's characters one by one.
    // If character is not in bag, append to returnString.
    for (i = 0; i < s.length; i++)
    {   
        // Check that current character isn't whitespace.
        var c = s.charAt(i);
        if (bag.indexOf(c) == -1) returnString += c;
    }
    return returnString;
}

function checkInternationalPhone(strPhone){
var bracket=3
strPhone=trim(strPhone)
if(strPhone.indexOf("+")>1) return false
if(strPhone.indexOf("-")!=-1)bracket=bracket+1
if(strPhone.indexOf("(")!=-1 && strPhone.indexOf("(")>bracket)return false
var brchr=strPhone.indexOf("(")
if(strPhone.indexOf("(")!=-1 && strPhone.charAt(brchr+2)!=")")return false
if(strPhone.indexOf("(")==-1 && strPhone.indexOf(")")!=-1)return false
s=stripCharsInBag(strPhone,validWorldPhoneChars);
return (isInteger(s) && s.length >= minDigitsInIPhoneNumber);
}

function ValidateForm(){
var Phone=document.frmSample.txtPhone
if ((Phone.value==null)||(Phone.value=="")){
alert("Please Enter your Phone Number")
Phone.focus()
return false
}
if (checkInternationalPhone(Phone.value)==false){
alert("Please Enter a Valid Phone Number")
Phone.value=""
Phone.focus()
return false
}
return true
 }
</script
<body>

<form name="frmSample" method="post" action="#" onSubmit="return ValidateForm()">
                <p>Enter a phone number : 
                  <input type="text" name="txtPhone">
                </p>
                <p> 
                  <input type="submit" name="Submit" value="Submit">
                </p>
              </form

</body>
</html>

Monday, September 10, 2012

simple function creation in Javascript

Learn javascript functions

Events Sample

<HTML>
<HEAD>
<TITLE>JavaScript Events</TITLE>
<SCRIPT LANGUAGE="JavaScript">
num=0
function handler()
{
return confirm("Are you sure you want to visit Blessys Blog?")
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="www.astrocity.com" onClick='return handler()'>Visit blessys.blogspot.com</A>
</BODY>
</HTML>



simple function invocation in Javascript

Javascript tutorial functions


Javascript Events Sample


<HTML>
<HEAD>
<TITLE>JavaScript Events</TITLE>
<SCRIPT LANGUAGE="JavaScript">
num=0
function handler()
{
num++
alert("Number : "+num)
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="J1.HTML" onMouseOver='handler()' > Place Your Mouse Cursor Over This </A>
</BODY>
</HTML>

window object use in Javascript

javascript online traing window object

Window Object Example



<html>
<head>
<title>Window Object</title>
<script language="JavaScript">
opened=0
window.defaultStatus="Program using window object"
function func1()
{
var1=open("event1.html", "win1", "menubar=no, toolbar=no")
opened=1
window.status="event1.html is now opened"
}
function func2()
{
if (var1.closed)
{
alert("Window already closed")
window.status="event1.html is closed"
}
else
{
var1.close()
window.status="event1.html is closed"
opened=0
}
}
function func3()
{
if (!var1.closed)
{
alert("Child Window Open - cannot close")
}
else
{
if (confirm("Close window?"))
           {
window.close()
}
}
}
function func4()
{
if ((!var1.closed) && (opened==1))
          {
var1.document.bgColor="#FF0000"
var1.focus()
}
else
{
alert("event1.html Window Not Open")
}
}
function func5()
{
if ((!var1.closed) && (opened==1))
{
var1.document.bgColor="#0000FF"
var1.focus()
}
else
{
alert("event1.html Window Not Open")
}
}
function func6()
{
if ((!var1.closed) && (opened==1))
{
var1.document.bgColor="#00ff00"
var1.focus()
}
else
{
alert("event1.html Window Not Open")
}
}
</script>
</head>
<body>
<center>
<br><br>
<input type="button" name="but1" value="Open event1.html"
onClick='func1()'>
<br><br>
<input type="button" name="but2" value="Close event1.html"
onClick='func2()'>
<br><br>
<input type="button" name="but3" value="Close this window"
onClick='func3()'>
<br><br>
<hr align="center" width="50%">
<p align="center">click the buttons below to change background
color of new window</p>
<input type="button" name="but4" value="red" onClick='func4()'>
<input type="button" name="but5" value="blue" onClick='func5()'>
<input type="button" name="but6" value="green" onClick='func6()'>
</center>
</body>
</html>



onMouseOver Events example in Javascript



Events example in Javascript


<html>
<head>
<title> mouseover Event </title>
<script language="JAVASCRIPT">
function func(s)
{
str="You have placed mouse cursor on the alphabet-"
str += s
document.form1.message.value=str
}
function func1()
{
document.form1.message.value="Place mouse cursor over any alphabet"
}
</script>
</head>
<body>
<center>
<A HREF="" onClick='return false' onMouseOver='func("A")' onMouseOut
= 'func1()'>A</A>
<A HREF="" onClick='return false' onMouseOver='func("B")' onMouseOut
= 'func1()'>B</A>
<A HREF="" onClick='return false' onMouseOver='func("C")' onMouseOut
= 'func1()'>C</A>
<A HREF="" onClick='return false' onMouseOver='func("D")' onMouseOut
= 'func1()'>D</A>
<A HREF="" onClick='return false' onMouseOver='func("E")' onMouseOut
= 'func1()'>E</A>
<A HREF="" onClick='return false' onMouseOver='func("F")' onMouseOut
= 'func1()'>F</A>
<A HREF="" onClick='return false' onMouseOver='func("G")' onMouseOut
= 'func1()'>G</A>
<A HREF="" onClick='return false' onMouseOver='func("H")' onMouseOut
= 'func1()'>H</A>
<A HREF="" onClick='return false' onMouseOver='func("I")' onMouseOut
= 'func1()'>I</A>
<A HREF="" onClick='return false' onMouseOver='func("J")' onMouseOut
= 'func1()'>J</A>
<A HREF="" onClick='return false' onMouseOver='func("K")' onMouseOut
= 'func1()'>K</A>
<A HREF="" onClick='return false' onMouseOver='func("L")' onMouseOut
= 'func1()'>L</A>
<A HREF="" onClick='return false' onMouseOver='func("M")' onMouseOut
= 'func1()'>M</A>
<A HREF="" onClick='return false' onMouseOver='func("N")' onMouseOut
= 'func1()'>N</A>
<A HREF="" onClick='return false' onMouseOver='func("O")' onMouseOut
= 'func1()'>O</A>
<A HREF="" onClick='return false' onMouseOver='func("P")' onMouseOut
= 'func1()'>P</A>
<A HREF="" onClick='return false' onMouseOver='func("Q")' onMouseOut
= 'func1()'>Q</A>
<A HREF="" onClick='return false' onMouseOver='func("R")' onMouseOut
= 'func1()'>R</A>
<A HREF="" onClick='return false' onMouseOver='func("S")' onMouseOut
= 'func1()'>S</A>
<A HREF="" onClick='return false' onMouseOver='func("T")' onMouseOut
= 'func1()'>T</A>
<A HREF="" onClick='return false' onMouseOver='func("U")' onMouseOut
= 'func1()'>U</A>
<A HREF="" onClick='return false' onMouseOver='func("V")' onMouseOut
= 'func1()'>V</A>
<A HREF="" onClick='return false' onMouseOver='func("W")' onMouseOut
= 'func1()'>W</A>
<A HREF="" onClick='return false' onMouseOver='func("X")' onMouseOut
= 'func1()'>X</A>
<A HREF="" onClick='return false' onMouseOver='func("Y")' onMouseOut
= 'func1()'>Y</A>
<A HREF="" onClick='return false' onMouseOver='func("Z")' onMouseOut
= 'func1()'>Z</A>
<br>
<br>
<form name="form1">
<input type="text" name="message" size="50" value="Place mouse cursor over any alphabet">
</form>
</center>
</body>
</html>

Array Manipulation in Javascript




Array Manipulation in Javascript


Tuesday, September 4, 2012

JavaScript Introduction


Introduction to Javascript

Introduction JavaScript


JavaScript is the number one scripting language on the internet,that  works in all most all  major browsers, such as Internet Explorer, Firefox, Chrome, Opera, and Safari.

What is JavaScript?

· JavaScript was designed to add interactivity to HTML pages

· JavaScript is a scripting language

· A scripting language is a lightweight programming language

· JavaScript is usually embedded directly into HTML pages

· JavaScript is an interpreted language (means that scripts execute without preliminary compilation)

· Everyone can use JavaScript without purchasing a license

 Many thinks that Java and Javascripts are relatives !!  But they  are two completely different languages in both concept  as well as design!
Java (developed by Sun Microsystems) is a powerful and much more complex programming language - in the same category as C and C++.
Example 1














Example 2




Example 3


 You can place an unlimited number of scripts in your document, and you can have scripts in both the body and the head section at the same time.
It is a common practice to put all functions in the head section, or at the bottom of the page. This way they are all in one place and do not interfere with page content.

Storing JavaScript in External Files


JavaScript can also be placed in external files.
External JavaScript files often contain code to be used on several different web pages.
External JavaScript files have the file extension .js.
Note: External script cannot contain the tags!
To use an external script, point to the .js file in the "src" attribute of the














JavaScript is highly Case Sensitive


Unlike HTML, JavaScript is case sensitive - therefore watch your capitalization closely when you write JavaScript statements, create or call variables, objects and functions.

Example 4

JavaScript Comments


Single line comments start with //.
Multi line comments start with /* and end with */.

Variables in JavaScript


  JavaScript variables are used to hold values or expressions.
A variable can have a short name, like x, or a more descriptive name, like carname.

Rules for JavaScript variable names:


· Variable names are case sensitive (y and Y are two different variables)
· Variable names must begin with a letter or the underscore character.
Example

















The script above declares a variable,assigns a value to it, displays the value, changes the value,and displays the value again.



JavaScript Arithmetic Operators




JavaScript Assignment Operators



The Different uses of + Operator
The + operator can also be used to add string variables or text values together.
To add two or more string variables together, use the + operator.

a1="Have ";
a2=" a nice day";
a3=a1+at2;


Comparison Operators


Logical Operators


Conditional Operator

variablename=(condition)?value1:value2

Example

solute=(gender=="male")?"Dear Sir ":"Dear  Mam";


Conditional Statements

 JavaScript has  following conditional statements:
· if statement - Execute  a single or set of statements based on a specified condition is true
· if...else statement -This statement  executes some code if the condition is true and another code if the condition is false
· if...else if....else statement - use this statement to select one of many blocks of code to be executed
· switch statement - use this statement to select one of many blocks of code to be executed


If Statement
Syntax

if (condition)
  {
  code to be executed if condition is true
  }
Example





If...else Statement
Syntax

if (condition)
  {
  code to be executed if condition is true
  }
else
  {
  code to be executed if condition is not true
  }

Example















If...else if...else Statement
Syntax:

if (condition1)
  {
  code to be executed if condition1 is true
  }
else if (condition2)
  {
  code to be executed if condition2 is true
  }
else
  {
  code to be executed if neither condition1 nor condition2 is true
  }


Example























The Switch Statement
 Syntax

switch(n)
{
case 1:
  execute code block 1
  break;
case 2:
  execute code block 2
  break;
default:
  code to be executed if n is different from case 1 and 2
}


Example





JavaScript Popups

JavaScript has three  popup boxes: Alert box, Confirm box, and Prompt box.

Alert Box
An alert box is  a dialog box which is  used if you want to make sure information comes through to the user.
When an alert box pops up, the user will have to click "OK" to proceed.
Syntax

alert("something");

Example






 












Confirm Box


A confirm box is often used if you want the user to confirm or avoid something.
When a confirm box pops up, the user will have to click either "OK" or "Cancel" to proceed.
If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box returns false.
Syntax
confirm("something");

Example



Prompt Box

A prompt box is often used if you want the user to input a value before entering a page.
When a prompt box pops up, the user will have to click either "OK" or "Cancel" to proceed after entering an input value.
If the user clicks "OK" the box returns the input value. If the user clicks "Cancel" the box returns null.
Syntax
prompt("sometext","defaultvalue");

Example