Begin scripting
12
Begin Scripting! Debjani Roy Induction Training
-
Upload
debjani-roy -
Category
Technology
-
view
63 -
download
0
Transcript of Begin scripting
11
Begin Scripting!Debjani Roy
Induction Training
2
The Document Object Model
3
Sample Form HTML<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Name</title>
<style>
<!--
p { font-family: Arial; font-size: 10pt; color: #000000 }
-->
</style>
</head>
<body>
<form method="POST" name="myForm">
<p>
Name:
<input type="text" name="name" value="" width=20>
</p>
<p>
<input type="submit" value="Submit" name="B1">
<input type="reset" value="Reset" name="B2">
</p>
</form>
</body>
</html>
4
Form
5
Sample Script Functions: Scripts are written using a function. A function is a block of code that aims to
perform a set of related actions.
Syntax:function function_name(){Script code goes here}
The keyword “function” should be in lower case
Functions are written between the <script> </script> tags
<script language="javascript" type="text/javascript">
function function_name(){Script code goes here}
function function name(){Script code goes here}
</script>
6
Variables Variables are containers that hold values. You can declare variables
and store values in them
Declare variable:var fullname;
Assign value to variable:fullname=“Tom”;
Declare and assign value to a variable:var fullname=“Tom”;
The length of a variable can be obtained by the length property:len=fullname.length;
7
Associating a Function with an Event A function is called by associating the function with the event handler
of the object.
Example:<input type="submit" value="Submit" name="submit" onclick="checkValues()">
The function in the script tag:<script language="javascript" type="text/javascript">function checkValues(){
// some code goes here}</script>
8
Script for function checkvalues() <script language="javascript" type="text/javascript">
function checkValues()
{
var fullnametxt;
var fullnamelength;
fullnametxt=document.myForm.name.value;
if(fullnametxt=="")
{
var error="Please enter your name";
alert(error);
document.myForm.name.focus;
}
}
</script>
9
Associate function with an event
<input type="submit" value="Submit" name="submit" onclick="checkValues()">
10
Execute the Script
11
Refine the Script<script language="javascript" type="text/javascript">
function checkValues()
{
var fullnametxt;
var fullnamelength;
fullnametxt=document.myForm.name.value;
if(fullnametxt=="")
{
var error="Please enter your name";
alert(error);
document.myForm.name.focus;
}
else
{
alert("hello "+fullnametxt);
}
}
</script>
12
Execute the Script
