JAVA FOR ALL: JavaScript

Showing posts with label JavaScript. Show all posts

JavaScripy wait while paging loading display image?

>> Monday, June 20, 2011

<html>
<head>
</head>

<body onLoad="init()">
<div id="loading" style="position:absolute; width:100%; text-align:center; top:300px;"><img src="webpageloading.jpeg" border=0></div>
<script>
var ld=(document.all);

var ns4=document.layers;
var ns6=document.getElementById&&!document.all;
var ie4=document.all;

if (ns4)
 ld=document.loading;
else if (ns6)
 ld=document.getElementById("loading").style;
else if (ie4)
 ld=document.all.loading.style;

function init()
{
if(ns4){ld.visibility="hidden";}
else if (ns6||ie4) ld.display="none";
}
</script>
<center><img src="webpageloading.jpeg"></center>
</body>
</html>

 }
  function mousehandler(e){
  var myevent = (isNS) ? e : event;
  var eventbutton = (isNS) ? myevent.which : myevent.button;
 alert(&quot;right is disabled due some security reasons&quot;);
    if((eventbutton==2)||(eventbutton==3)) return false;
 }
 document.oncontextmenu = mischandler;
 document.onmousedown = mousehandler;
 document.onmouseup = mousehandler;
  &lt;/script&gt;
 &lt;/head&gt;

 &lt;body&gt;
  
 &lt;

Disable the right click using javascript?

In this tutorial we are disabling the right click by using javascript

Copy the code and try it

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  
    <script language="javascript">
 var isNS = (navigator.appName == "Netscape") ? 1 : 0;
  if(navigator.appName == "Netscape") document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);
 
  function mischandler(){
   return false;
 }
  function mousehandler(e){
  var myevent = (isNS) ? e : event;
  var eventbutton = (isNS) ? myevent.which : myevent.button;
 alert("right is disabled due some security reasons");
    if((eventbutton==2)||(eventbutton==3)) return false;
 }
 document.oncontextmenu = mischandler;
 document.onmousedown = mousehandler;
 document.onmouseup = mousehandler;
  </script>
 </head>

 <body>
  
 </body>
</html>

When we run the code it looks like below

When we use right click it appears like below image

Form Validation using Java Script?

>> Saturday, June 18, 2011

                                                                  FORM VALIDATION
               THE Form is shown below and we are writing validation for this form

<HTML>
<HEAD>
        <TITLE>Comment Form</TITLE>
<Script language = javascript>

function Validate() {
Message = ""
Message = Message + CheckName()
Message = Message + CheckEmail()
Message = Message + CheckComments()
Message = Message + CheckLikes()
Message = Message + CheckHates()

if (Message == "") {
return true
}
else {
alert(Message)
return false
}

}


function CheckName() {
UserName = document.f1.Name.value

if (UserName == "") {
Message = "Something's wrong with your name" + "\n"
}
else {
Message = ""
}
return Message

}

function CheckEmail() {
email = document.f1.Email.value
AtPos = email.indexOf("@")
StopPos = email.lastIndexOf(".")
Message = ""

if (email == "") {
Message = "Not a valid Email address" + "\n"
return Message
}

if (AtPos == -1 || StopPos == -1) {
Message = "Not a valid email address" + "\n"
return Message
}

if (StopPos < AtPos) {
Message = "Not a valid email address" + "\n"
return Message
}

if (StopPos - AtPos == 1) {
Message = "Not a valid email address" + "\n"
return Message
} 


}


function CheckComments() {
 comments = document.f1.Comments.value

 if (comments == "Add Your Comments here") {
  Message = "No Comments added" + "\n"
 }
 else {
  Message = ""
 }

 return Message

}

function CheckLikes() {
boxes = document.f1.Liked.length
txt = ""
for (i = 0; i < boxes; i++) {
if (document.f1.Liked[i].checked) {
txt = txt + document.f1.Liked[i].value + " "
}
}


if (txt == "") {
Message = "No Likes Boxes ticked" + "\n"
}
else {
Message = ""
}

return Message


}


function CheckHates() {
boxes = document.f1.Hated.length
txt = ""
for (i = 0; i < boxes; i++) {
 if (document.f1.Hated[i].checked) {
  txt = txt + document.f1.Hated[i].value + " "
 }
}

if (txt == "") {
 Message = "No Hate Boxes ticked" + "\n"
}

else {
 Message = ""
}

return Message

}



</script>
</HEAD>
<BODY BGCOLOR = White>
<form name="f1" method="post" action="" onSubmit="return Validate()" enctype = text/plain>
  <table width="672" border="0" cellpadding="0" cellspacing="0">
    <tr> 
      <td width="142" valign="top" rowspan="4">&nbsp;</td>
      <td valign="top" height="45" colspan="4" align="center"> <b>Name:</b> 
        <input type="text" name="Name" size="30">
      </td>
    </tr>
    <tr> 
      <td height="40" valign="top" colspan="4" align="center"><b>Email: 
        <input type="text" name="Email" size="30">
        </b></td>
    </tr>
    <tr> 
      <td height="151" valign="top" colspan="4" align="center"> 
        <textarea name="Comments" cols="40" rows="7">Add Your Comments here</textarea>
      </td>
    </tr>
    <tr> 
      <td height="150" valign="top" colspan="2">&nbsp;</td>
      <td valign="top" width="240"> <b>What did you like about the Site?</b> 
        <p> 
          <input type="checkbox" name="Liked" value="Cool Layout">
          Cool Layout</p>
        <p> 
          <input type="checkbox"name="Liked" value="Easy to Navigaten">
          Easy to Navigate</p>
        <p> 
          <input type="checkbox" name="Liked" value="Great Contents">
          Great Contents</p>
      </td>
      <td width="240" valign="top"> <b>What did you hate about the site?</b> 
        <p> 
          <input type="checkbox" name="Hated" value="Awful Layou">
          Awful Layout</p>
        <p> 
          <input type="checkbox" name="Hated" value="Difficult to Navigate">
          Difficult to Navigate</p>
        <p> 
          <input type="checkbox" name="Hated" value="Lousy Contents">
          Lousy Contents</p>
      </td>
    </tr>
    <tr align="center"> 
      <td height="80" colspan="2" valign="top">&nbsp;</td>
      <td valign="top" colspan="3"> 
        <input type="submit" name="Submit" value="Submit This Form">
        <input type="reset" name="Submit2" value="Reset This Form">
      </td>
    </tr>
    <tr> 
      <td height="0"></td>
      <td width="40"></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr> 
      <td height="1"></td>
      <td></td>
      <td width="10"></td>
      <td></td>
      <td></td>
    </tr>
  </table>
</form>
</BODY>
</HTML>

If we doesn't provide proper data the the output looks like below

JavaScript Validation for DropDown Menu List?

Drop Down List Validation
When click the submit button The image is shown below

The code is shown below:

<HTML><HEAD>
<TITLE>Dropdown Validation</TITLE>

<SCRIPT LANGUAGE="JavaScript"'>
<!--

function validateForm(thisform){
if(document.ItemList.drpDown.selectedIndex==0)
{
alert("Please select an Item.");
document.ItemList.drpDown.focus();

}
return false;
}

//-->
</SCRIPT>
</HEAD>

<BODY>
Please choose an item from the drop down menu:

<form name="ItemList" method="post" action="/bhaskar">
<table width="100%" border="0">
<tr>
<td width="135">Choose a username: </td>
<td>
<select name="drpDown">
<option value selected>-- SELECT --</option>
<option value>Apples</option>
<option value>Oranges</option>
</select>
<input type="submit" name="Submit" onclick="validateForm(ItemList);return false;" value="Submit" >
</td></tr></table></form>
</BODY>
</HTML>

If we doesn't select any Drop down menu the output is shown in below image

JavaScript validation for Radio Buttons?

RADIO BUTTON VALIDATION

<html>
<title>RadioButtons Validation</title>
<head>
<script type="text/javascript">

function valbutton(thisform) {
// place any other field validations that you require here
// validate myradiobuttons
myOption = 0;
for (i=thisform.myradiobutton.length-1; i > 0; i--) {
if (thisform.myradiobutton[i].checked) {
myOption = i; i = 0;
}
}
if (myOption == 0) {
alert("You must select a radio button");
return false;
}
// place any other field validations that you require here
//thisform.submit(); // this line submits the form after validation
} 
  
</script>
</head>
<body>
<form name="myform">
<input type="radio" value="1st value" name="myradiobutton" />1st<br />
<input type="radio" value="2nd value" name="myradiobutton" />2nd<br />
<input type="radio" value="3rd value" name="myradiobutton" />3rd<br />&nbsp;<br />
<input type="submit" name="submitit" onclick="valbutton(myform);return false;" value="Validate" />
<input type="reset" name="reset" value="Clear" />
</form> 
</body>
</html>

>> Friday, June 17, 2011

TextArea Validation

<html>
<title>TextArea</title>
<head>
<script type="text/javascript">

function CheckComments(thisform) {
 comments = document.f1.Comments.value

 if (comments == "") {
  Message = "No Comments added" + "\n"
  alert("no comments are added");
 }
 else {
  Message = ""
 }

 return false;

}
</script>
</head>
<body>
<form action="/bhaskar" name="f1">
<table>
 <tr> 
      Comments:<td height="151" valign="top" colspan="4" align="center"> 
        <textarea name="Comments" cols="40" rows="7"></textarea>

      </td>
    </tr>
      </table>
<input type="submit" value="submit" onclick="CheckComments(f1);return false;"></input>
</body>
</html>

JavaScript for Email Validation?

Email Validation:

Email VAlidation.

<html>
<title>EmailValidation</title>
<head>
<script type="text/javascript">
function CheckEmail(f1) {
email = document.f1.emaill.value
AtPos = email.indexOf("@")
StopPos = email.lastIndexOf(".")
Message = ""

if (email == "") {
Message = "Not a valid Email address" + "\n"
alert("Not a valid Email address" + "\n");
document.write("not a gmail");
}

if (AtPos == -1 || StopPos == -1) {
Message = "Not a valid email address"
alert("Not a valid email address");
document.write("chech ur mail id");
}

if (StopPos < AtPos) {
Message = "Not a valid email address"
alert("Not a valid email address");
document.write("not a valid email");
}

if (StopPos - AtPos == 1) {
Message = "Not a valid email address"
alert("Not a valid email address");
document.write("missing .in email");
}

return false;
}
</script>
</head>
<body>
<form method="post" name="f1">
Email:<input type="text" name="emaill"/>
<input type="submit" onclick="CheckEmail(f1);return false;" value="submit"></input>
</body>
</html>

Adding numbers to text box and providing output in text box?

>> Wednesday, June 8, 2011

<html>
<SCRIPT language = JavaScript>

function calculate() {
A = document.frmOne.txtFirstNumber.value
B = document.frmOne.txtSecondNumber.value
C = (A + B)
document.frmOne.txtThirdNumber.value = C
}

</SCRIPT>
<FORM NAME = frmOne>

Number One: <INPUT TYPE = Text NAME = txtFirstNumber SIZE = 5 value ="">//enter value=5;

Number Two: <INPUT TYPE = Text NAME = txtSecondNumber SIZE = 5 value ="">//enter value=6;
<P>
Total: <INPUT TYPE = Text NAME = txtThirdNumber SIZE = 5 value = "">//we will get total as 56 when we submit the button.
<P>
<Input Type = Button NAME = b1 VALUE = "Add Numbers" onClick = calculate()>

</FORM>
</html>

How to make a page to move back page?

Use the below code to make the page to go back
window.history.back()

Different background colors by clicking buttpns?

<HTML>
<BODY>

<INPUT TYPE = Button VALUE = "Colour One" Onclick = "document.bgColor = 'Red'">

<INPUT TYPE = Button VALUE = "Colour Two" Onclick = "document.bgColor = 'Blue'">

<INPUT TYPE = Button VALUE = "Colour Three" Onclick = "document.bgColor = 'Green'">

</BODY>//The background colour of your web page should have changed colour when you clicked a button.
It did this because of the bgColor poperty of the document object.
</HTML>

Sample JavaScript with onClick attribute?

<HTML>
<HEAD>
<TITLE>A First Script</TITLE>

<SCRIPT LANGUAGE = JavaScript>

document.write("Hello World")

</SCRIPT>

</HEAD>

<BODY>
<INPUT TYPE = Button VALUE = "Click Me" OnClick = "document.write('Hello World')">
//a OnClick is an event that can be applied to buttons
</BODY>
</HTML>

How to disable refresh button in your application?

Copy the below code and paste in our appliction

<html>
<script type="text/javascript">
function showKeyCode(e)
{
alert("Inside function showKeyCode(e)");
var keycode =(window.event) ? event.keyCode : e.keyCode;

if(keycode == 116)
{
alert("refresh button will not work");
event.keyCode = 0;
event.returnValue = false;
return false;
}
}
</script>

With Body sectiong

<body onKeyDown ="showKeyCode();">
</body>
</html>

JAVA FOR ALL

Linkbar

JavaScripy wait while paging loading display image?

>> Monday, June 20, 2011

Disable the right click using javascript?

Form Validation using Java Script?

>> Saturday, June 18, 2011

JavaScript Validation for DropDown Menu List?

JavaScript validation for Radio Buttons?

JavaScript for Textarea?

>> Friday, June 17, 2011

JavaScript for chechBoxes?

JavaScript for Email Validation?

Adding numbers to text box and providing output in text box?

>> Wednesday, June 8, 2011

How to make a page to move back page?

Different background colors by clicking buttpns?

Sample JavaScript with onClick attribute?

How to disable refresh button in your application?

FaceBook Login

INTERVIEW QUESTIONS AND ANSWERS

Search This Blog

Subscribe via email

Label

Tags

Blog Archive

Popular Posts

Followers

image

LIST of FAVORITES

Feedjit

HTML/JAVASCRIPT

HTML/JAVASCRIPT

Total Pageviews

STATCOUNTER

Footer