education: Javascript Blog

Showing posts with label Javascript Blog. Show all posts

JavaScript Loops

10:48 | Posted by Unknown |

JavaScript Loops

The for Loop

How many times the script should run then we used for loop.

Syntax

for (variable=startvalue;variable<=endvalue;variable=variable+increment)
{
//code 
}

The while Loop

The while loop loops through a block of code while a specified condition is true.

Syntax

while (variable<=endvalue)
{
//code 
}

Example:

Step 1. Written below code in your application.

<html>
<body>
<script type="text/javascript">
var i=0;
for (i=0;i<=10;i++)
  {
  document.write("The number is " + i);
  document.write("<br />");
  }
</script>
</body>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

Show a Military Clock and ordinary clock

10:45 | Posted by Unknown |

Show a Military Clock and ordinary clock

Step 1. Written below code in your application.


<html>
    <SCRIPT>
var now;
function showMilitaryTime() {
     if (document.theForm.showMilitary[0].checked) {
          return true;
     }
     return false;
}
function showTheHours(theHour) {
     if (showMilitaryTime() || (theHour > 0 && theHour < 13)) {
          return (theHour);
     }
     if (theHour == 0) {
          return (12);
     }
     return (theHour - 12);
}
function showZeroFilled(inValue) {
     if (inValue > 9) {
          return ":" + inValue;
     }
     return ":0" + inValue;
}
function showAmPm() {
     if (showMilitaryTime()) {
          return ("");
     }
     if (now.getHours() < 12) {
          return (" am");
     }
     return (" pm");
}
function showTheTime() {
     now = new Date();
     document.theForm.showTime.value =
     showTheHours(now.getHours()) +
     showZeroFilled(now.getMinutes()) +
     showZeroFilled(now.getSeconds()) +
     showAmPm();
     setTimeout("showTheTime()", 1000);
}
</SCRIPT>
<BODY onLoad="showTheTime();">
<FORM NAME="theForm">
     <INPUT TYPE="TEXT" NAME="showTime">
     Display Military Time?
     <INPUT TYPE="RADIO" NAME="showMilitary" CHECKED>Yes
     <INPUT TYPE="RADIO" NAME="showMilitary">No
</FORM>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

How To validate a Form in ASP. Net

10:43 | Posted by Unknown |

How To validate a Form in ASP. Net

Step 1. Written below code in your application.

JavaScript Code


<script language="javascript" type="text/javascript">
function validate()
{
if (document.getElementById("<%=TextBox1.ClientID%>").value=="")
      {
                 alert("Name can not be blank");
                 document.getElementById("<%=TextBox1.ClientID%>").focus();
                 return false;
      }
      
      if(document.getElementById("<%=TextBox2.ClientID %>").value=="")
      {
                 alert("Email id can not be blank");
                document.getElementById("<%=TextBox2.ClientID %>").focus();
                return false;
      }
     var emailPat= /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
     var emailid=document.getElementById("<%=TextBox2.ClientID %>").value;
     var matchArray = emailid.match(emailPat);
     if (matchArray == null)
    {
               alert("Your email address seems incorrect. Please try again.");
               document.getElementById("<%=TextBox2.ClientID %>").focus();
               return false;
    }
    if (document.getElementById("<%=TextBox3.ClientID%>").value=="")
      {
                 alert("Contact Number can not be blank");
                 document.getElementById("<%=TextBox3.ClientID%>").focus();
                 return false;
      }
     var digits="0123456789";
     var temp;
     for (var i=0;i<document.getElementById("<%=TextBox3.ClientID %>").value.
length;i++)
     {
     temp=document.getElementById("<%=TextBox3.ClientID%>").value.
substring(i,i+1);
     if (digits.indexOf(temp)==-1)
      {
      alert("Please enter correct Contact Number");
      document.getElementById("<%=TextBox3.ClientID%>").focus();
      return false;
      }
     }
      if(document.getElementById("<%=TextBox5.ClientID %>").value=="")
    {
      alert("City can not be blank");
     document.getElementById("<%=TextBox5.ClientID %>").value;
      document.getElementById("<%=TextBox5.ClientID %>").focus();
      return false;
    }
      if(document.getElementById("<%=TextBox6.ClientID %>").value=="")
    {
     alert("Password can not be blank");
     document.getElementById("<%=TextBox6.ClientID %>").value;
     document.getElementById("<%=TextBox6.ClientID %>").focus();
      return false;
    }
    if(document.getElementById("<%=TextBox7.ClientID %>").value=="")
    {
     alert("Please Re-Enter Password ");
   document.getElementById("<%=TextBox7.ClientID %>").value;
   document.getElementById("<%=TextBox7.ClientID %>").focus();
    return false;
    }
     return true;
}
</script>

Default.aspx Code


<%@ Page Language="C#" AutoEventWireup="true"  
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
    <title>Form Validation</title>
    </head>
<body>
    <form id="form1" runat="server">
    <script language="javascript">

//Write JavaScript Code
</script>
  <div>
  <table >
  <tr><td>Name</td>
  <td><asp:TextBox ID="TextBox1" runat="server"
             Width="193px"></asp:TextBox></td></tr>
            <tr> <td>Email ID</td>
          <td><asp:TextBox ID="TextBox2" runat="server" Width="193px" 
            ToolTip="Enter unique Email ID" AutoPostBack="True">
            </asp:TextBox></td></tr>
            <tr><td>Contact Number</td><td>
              <asp:TextBox ID="TextBox3" runat="server" Width="193px" 
  AutoPostBack="True"></asp:TextBox></td></tr>
            <tr><td> Sex</td>
    <td><asp:RadioButton ID="RadioButton1" runat="server" Text="Male" 
GroupName="a" />
    <asp:RadioButton ID="RadioButton2" runat="server" Text="Female"
 GroupName="a" /></td>
      </tr>
  <tr> <td>Enter&nbsp; City</td>
   <td><asp:TextBox ID="TextBox5" runat="server" Height="22px" Width="193px"
></asp:TextBox>
                </td></tr>
  <tr><td>Password</td>
    <td><asp:TextBox ID="TextBox6" runat="server" Width="193px"
 TextMode="Password" >
    </asp:TextBox></td>            </tr>
    <tr><td>Re-Enter Password</td>
     <td> <asp:TextBox ID="TextBox7" runat="server" TextMode="Password"
 Width="193px" 
              Height="22px"></asp:TextBox> </td> </tr>
            <tr><td><asp:Button ID="Button1" runat="server" Text="Submit" 
                        onclick="Button1_Click" OnClientClick="return validate() " />
                    </td></tr></table></div>
    </form>
</body>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

How to show Day of Week

10:38 | Posted by Unknown |

How to show Day of Week

Step 1. Written below code in your application.

<html>
<script language="javascript">
function get_day()
{
    var getDay=new Date();
    if(getDay.getDay()>0 && getDay.getDay()<6)
    {
    alert("Its a Week Day");
    }
    else
    {
    alert("Its Week End!!!")    }
}
</script>
<body>
<input type="button" onclick="get_day()" value="Show Day" />
</body>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

How to Swap a Image using JavaScript

10:35 | Posted by Unknown |

How to Swap a Image using JavaScript

Step 1. Written below code in your application.


<html xmlns="http://www.w3.org/1999/xhtml">
<script language="javascript">
if (document.images) {
 smile = new Image
 happy = new Image
 smile.src = "http://images.zaazu.com/img/happy-roll-
 happy-animation-animated-smiley-emoticon-000359-large.gif"
 happy.src = "http://www.animationbuddy.com/Animation/Nature/Sun/
Sun_happy.gif"
}
function imageSwap(thisImage,newImage) {
 if (document.images) {
  document[thisImage].src = eval(newImage + ".src")
 }
}
</script>
<a href="http://www.r4r.co.in/"
onMouseOver="imageSwap('aditya','happy')"
onMouseOut="imageSwap('aditya','smile')">
<img src="http://images.zaazu.com/img/happy-roll-happy-animation
 -animated-smiley-emoticon-000359-large.gif"
 width="150"
 height="150"
 border="0"
 alt="Picture of Jack"
 name="aditya">
</a>
</script>
</html>

Step 2. Run the Application. Click on Button.

OnMouseOut

OnMouseOver

Labels: Javascript Blog

Special Character in JavaScript

10:31 | Posted by Unknown |

Special Character in JavaScript

Code	Output
\'	single quote
\"	double quote
\\	backslash
\n	new line
\r	carriage return
\t	tab
\b	backspace
\f	form feed

Step 1. Written below code in your application.

<html>
<head>
<script type="text/javascript">
var txt="I am working in \"r4r\".";
document.write(txt);
</script>
</head>
<body>

</body>
</html>

Step 2. Run the Application.

Labels: Javascript Blog

Prompt Box in JavaScript

10:28 | Posted by Unknown |

Prompt Box in JavaScript

A prompt box is often used if you want the user to input a value before entering a page.

Step 1. Written below code in your application.

<html>
<head>
<script type="text/javascript">
function show_box()
{
var name=prompt("Please enter your name","Aditya Tiwari");
if (name!=null && name!="")
  {
  document.write("Hello " + name + "! How are you today?");
  }
}
</script>
</head>
<body>
<input type="button" onclick="show_box()" value="Show" />
</body>
</html>

Step 2. Run the Application. Click on Button.

You Entered in Website

Labels: Javascript Blog

Confirm Box in JavaScript

20:28 | Posted by Unknown |

Confirm Box in JavaScript

Step 1. Written below code in your application.

<html>
<head>
<script type="text/javascript">
function show_box()
{
var r=confirm("Press a button");
if (r==true)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }
}
</script>
</head>
<body>
<input type="button" onclick="show_box()" value="Confirm box" />
</body>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

How to access a URL of parent page in ASP. net

18:53 | Posted by Unknown |

How to access a URL of parent page in ASP. net

Step 1. Open a new website, add a button and textboxes control and named this page iframe.aspx. Design code is given below


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="iframe.aspx.cs" 
Inherits="iframe" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script language="javascript" src="JScript.js">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body><form id="form1" runat="server">
    <div>
    <asp:TextBox ID="TextBox1" runat="server">
    </asp:TextBox>
    <asp:TextBox ID="TextBox2" runat="server" 
    style="top: 66px; left: 10px; position: absolute; height: 22px; width: 
        128px">
    </asp:TextBox>
    <asp:Button ID="Button1" runat="server" Text="Button" 
    style="top: 120px; left: 12px; position: absolute; height: 26px; width: 
        56px" OnClientClick="uro()"/>
    </div>
    </form></body>
</html>

Step 2. Add a JavaScript file from Solution Explorer window

The code is written in JavaScript file is

function uro()
{
alert(parent.document.location.href);
}

function url()
{
alert(document.location.href);
}

Below code written in the design page to attached the JavaScript file to your project

Step 3. Add another page from new item selection menu. The design code of this page is (url.aspx)


<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="url.aspx.cs" 
Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script language="javascript" src="JScript.js">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>url</title>
</head>
<body>
    <form id="url" runat="server">
    <div>
   <asp:Button ID="Button1" runat="server" Text="Button" 
   onclientclick="url()"/>
   <iframe src="iframe.aspx" align="middle" height="350px" 
   name="Comments">
   </iframe>
   </div>
    </form>
</body>
</html>

Step 4. Now run the Application.

Labels: Javascript Blog

Introduction to Javascript Blog

01:30 | Posted by Unknown |

First Application Using JavaScript

Step 1. Written below code in your application.


<script language="javascript">
function displayDate()
{
alert(Date());
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Display</title>
</head>

<body>
    <form id="form1" runat="server">
    <div>
    <button type="button" onclick="displayDate()">DisplayDate</button>
    </div>
    </form>
</body>
</html>

Step 2. Run the Application. Click on Button.

Labels: Javascript Blog

Javascript Blog Content

01:23 | Posted by Unknown |

Labels: Javascript Blog

Blog Archive