|
|
|
|
|
|
Lesson#15
|
JAVA SCRIPTING-2
|
|
|
|
JAVA SCRIPTING (CONTINUED….)
Example Date object <HTML> <HEAD><TITLE>Writing the Current Date
and Time</TITLE>
</HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"
TYPE="text/javascript"> <!--
document.write(“Welcome! you are visiting my web site on " +
Date()) //--> </SCRIPT> </BODY>
</HTML> Result is shown in Fig. 1 below. Here, ‘Date()’ is the
constructor of the date object
whichprovides current date of the system.
Fig. 1
Getting date and time in a user friendly format
To get the date/time in a different format, an instance of the
date object can be created. In the following
example‘d’ is such an instance. To define the instance d of the
date object we have to use a constructor of
the date object, preceded by the word ‘new’. Constructor is
defined as the initializing function used to
create instance/copy of an object. It is after the name of the
object whose constructor it is. Note that we
can invoke or apply different methods/functions of the date
object using this instance ‘d’, e.g, d.getDay(),
d.getYear() etc.
<HTML> <HEAD><TITLE>Example - Current Date and Time</TITLE>
</HEAD> <BODY>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> <!--//
Store the date in a variable d =
new Date() dateText = ""// Get the current day and convert it to
the name of the day dayValue =
d.getDay() if (dayValue == 0)
dateText += "Sunday" else if (dayValue == 1) dateText +=
"Monday" else if (dayValue == 2)
dateText += "Tuesday" else if (dayValue == 3) dateText +=
"Wednesday" else if (dayValue == 4)
dateText += "Thursday" else if (dayValue == 5) dateText +=
"Friday" else if (dayValue == 6) dateText
+= "Saturday"
// Get the current month and convert it to the name of the month
monthValue = d.getMonth() dateText
+= " " if (monthValue == 0)
dateText += "January" if (monthValue == 1) dateText +=
"February" if (monthValue == 2) dateText +=
"March" if (monthValue == 3) dateText += "April" if (monthValue
== 4) dateText += "May" if
(monthValue == 5) dateText += "June"
if (monthValue == 6) dateText += "July" if (monthValue == 7)
dateText += "August" if (monthValue ==
8) dateText += "September" if (monthValue == 9) dateText +=
"October" if (monthValue == 10)
dateText += "November" if (monthValue == 11) dateText +=
"December"
// Get the current year; if it's before 2000, add 1900 if
(d.getYear() < 2000) dateText += " " +
d.getDate() + ", " + (1900 + d.getYear()) else
dateText += " " + d.getDate() + ", " + (d.getYear()) // Get the
current minutes minuteValue =
d.getMinutes() if (minuteValue < 10)
minuteValue = "0" + minuteValue // Get the current hours
hourValue = d.getHours() // Customize
the greeting based on the current hours if (hourValue < 12)
{
greeting = "Good morning!"
timeText = " at " + hourValue + ":" + minuteValue + " AM"
}
70
else if (hourValue == 12) { greeting = "Good afternoon!"
timeText = " at " + hourValue + ":" +
minuteValue + " PM" }
else if (hourValue < 17) { greeting = "Good afternoon!" timeText
= " at " + (hourValue-12) + ":" +
minuteValue + " PM" }
else { greeting = "Good evening!" timeText = " at " +
(hourValue-12) + ":" + minuteValue + " PM" }
// Write the greeting, the date, and the time to the page
document.write(greeting + " It's " + dateText +
timeText) //--> </SCRIPT> </BODY> </HTML> Result is shown in
Fig. 2 below. Note that mainly
three variables, greeting, dateText and timeText have been used.
Also, a number of if statements have been
used in order to get customized values.
Fig. 2
Example - String Object
In the following example, ‘str’ and ‘myArray’ are the instances
of string and array objects, respectively. The
size of the array is 10. Here, charAt() is the function/method
of string object. So, charAt(3) would provide
the value of the element at the index three. Different other
functions of string object have also been used.
In the example, str.Split(' ') splits the string on the basis of
blank space. After splitting, we assign parts of
the string as values for the array. <HTML> <HEAD><TITLE>Using
the String object</TITLE>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> <!--
//--> </SCRIPT></HEAD> <BODY> <H1>Using the String object </H1>
<SCRIPT
LANGUAGE="JavaScript" TYPE="text/javascript"> <!--str=new
String("This is a test of javascript
string methods"); myArray=new Array(10); myArray=str.split(' ');
document.write("str.charAt(3) :"
+str.charAt(3) +"<P>");
document.write("str.substring(20,25):"+str.substring(20,25)+"<P>");
document.write("str.toLowerCase() :"+str.toLowerCase()+"<P>");
document.write("str.toUpperCase()
:"+str.toUpperCase()+"<P>"); document.write("str.Split(' ')
myArray[0] :"+myArray[0]+"<P>");
document.write("str.Split(' ') myArray[1]:"+myArray[1]+"<P>");
//--> </SCRIPT> </BODY>
</HTML>
Result is shown in Fig. 3 below.
Fig. 3
71
Using java script for applying for checks in a registration form
We can use JavaScript for applying different checks on a web
form including pattern checking. Consider
following example in this behalf, where we use a JavaScript
function checkValues ():
<HEAD>
<script language="JavaScript">
<!--
function checkValues()
{
var Userlogin=document.regForm.userlogin.value; var
UserPassword=document.regForm.userPassword.value; var
conPassword=document.regForm.conPassword.value; var
userAddress=document.regForm.userAdd.value; var
name=document.regForm.Name.value; var
maxLength = 15; var minLength = 3;
if(Userlogin.length == 0||
userAddress.length==0||name.length==0)
{ alert("Please fill in all values"); return false;
} if(Userlogin.length < minLength || Userlogin.length >
maxLength ) {
alert("Login Name is limited to " + minLength + " - " +
maxLength + " characters");
return false; } if(UserPassword.length < minLength ||
UserPassword.length > maxLength) {
alert("Password is limited to " + minLength + " - " + maxLength
+ " characters");
return false;
}
else
{
for(i=0;i<Userlogin.length;i++)
{ if(Userlogin.charAt(i) == "," || Userlogin.charAt(i) == ";") {
alert("invalid login name"); return false; } } }
if(UserPassword!=conPassword)
{ alert("Passwords do not match"); return false;
}
return true;
}
//--> </script> <BODY onload="onwindowload()"> <font size="3"
face="Arial"
color=red><strong></font> <H3>To Register Please Enter The
Following Information:</H3>
<FORM NAME="regForm" ACTION="regcheck.asp" METHOD="POST"
onSubmit="return
checkValues()"> Name: <INPUT TYPE="TEXT" NAME="Name"
maxlength="25">
<P>
Address: <INPUT TYPE="TEXT" NAME="userAdd" maxlength="50">
<P>
Login: <INPUT TYPE="TEXT" NAME="userlogin" maxlength=“20">
<P>
Password: <INPUT TYPE="Password" NAME="userPassword"
maxlength="15">
<P>
Confirm Password:<INPUT TYPE="Password" NAME="conPassword"
maxlength="15">
<P>
Email: <INPUT TYPE="TEXT" NAME="email" maxlength="15">
<P>
<INPUT TYPE="submit" NAME="Go" VALUE="Register!"> <INPUT
TYPE="RESET"
VALUE="Reset!"></FORM> </BODY> </HTML>
When a user just types name and omits to type either Userlogin
or userAddress, an alert box would be
displayed informing him to fill in all values. Accordingly,
false would be returned by the function
checkValues(), and no data would be forwarded to the server side
on clicking the submit (Register!) button.
Secondly, if the user violates the permissible limit of 3-15
characters in the text box for user login, again
a pop-up box can confront him with a message
.
Fig. 5
Similarly, if the user violates the permissible limit of 3-15
characters in respect of Password, an alert box can
inform him about it |
|
|
|
|