Sei sulla pagina 1di 11

JavaScript

Date comparison using java script


Mark list
Form validation using java script

Date Comparison using Java Script

Aim:

Algorithm:

Program:

datediff.html

<HTML>
<HEAD>
<SCRIPT LANGUAGE=JavaScript>
function writeOptions(startNumber, endNumber)
{
var optionCounter;
for (optionCounter = startNumber; optionCounter <= endNumber; optionCounter+
+)
{
document.write('<OPTION value=' + optionCounter + '>' +
optionCounter);
}
}
function writeMonthOptions()
{
var theMonth;var monthCounter;
var theDate = new Date();
for (monthCounter = 0; monthCounter < 12; monthCounter++)
{
theDate.setMonth(monthCounter);
theMonth = theDate.toString();
theMonth = theMonth.substr(4,3);
document.write('<OPTION value=' + theMonth + '>' + theMonth);
}
}
function recalcDateDiff()
{
var myForm = document.form1;
var firstDay = myForm.firstDay.options[myForm.firstDay.selectedIndex].value;
var secondDay =
myForm.secondDay.options[myForm.secondDay.selectedIndex].value;
var firstMonth = myForm.firstMonth.options[myForm.firstMonth.selectedIndex].value;
var secondMonth =
myForm.secondMonth.options[myForm.secondMonth.selectedIndex].value;
var firstYear = myForm.firstYear.options[myForm.firstYear.selectedIndex].value;
var secondYear =
myForm.secondYear.options[myForm.secondYear.selectedIndex].value;
var firstDate = new Date(firstDay + " " + firstMonth + " " + firstYear);
var secondDate = new Date(secondDay + " " + secondMonth + " " + secondYear);
var daysDiff = (secondDate.valueOf() - firstDate.valueOf());
daysDiff = Math.floor(Math.abs((((daysDiff / 1000) / 60) / 60) / 24));
myForm.txtDays.value = daysDiff;
var age=daysDiff/365;
myForm.age1.value=Math.floor(age);
return true;
}

function window_onload()
{
var theForm = document.form1;
var nowDate = new Date();
theForm.firstDay.options[nowDate.getDate() - 1].selected = true;
theForm.secondDay.options[nowDate.getDate() - 1].selected = true;
theForm.firstMonth.options[nowDate.getMonth()].selected = true;
theForm.secondMonth.options[nowDate.getMonth()].selected = true;
theForm.firstYear.options[nowDate.getFullYear()- 1970].selected = true;
theForm.secondYear.options[nowDate.getFullYear() - 1970].selected = true;
}
</SCRIPT>
</HEAD>
<BODY LANGUAGE="JavaScript" onload="return window_onload()">
<p>
<script type="text/javascript">
var d=new Date();
document.write("<b> DATE AND TIME</b> <br />");
document.write(d);
</script>
</p><B> DATE COMPARISION </B>
<FORM NAME="form1">
<P>Select your Date of Birth<BR>
<SELECT NAME="firstDay" SIZE="1" onchange="return recalcDateDiff()">
<SCRIPT LANGUAGE="JavaScript">
writeOptions(1,31);
</SCRIPT>
</SELECT>
<SELECT NAME="firstMonth" SIZE="1" onchange="return recalcDateDiff()">
<SCRIPT LANGUAGE=JavaScript>
writeMonthOptions();
</SCRIPT>
</SELECT>
<SELECT NAME="firstYear" SIZE="1" onchange="return recalcDateDiff()">
<SCRIPT LANGUAGE="JavaScript">
writeOptions(1970,2010);
</SCRIPT>
</SELECT>
</P>
<P>
Select End Date<BR>
<SELECT NAME="secondDay" SIZE="1" onchange="return recalcDateDiff()">
<SCRIPT LANGUAGE=JavaScript>
writeOptions(1,31);
</SCRIPT>
</SELECT>
<SELECT NAME="secondMonth" SIZE="1" onchange="return
recalcDateDiff()">
<SCRIPT LANGUAGE="JavaScript">
writeMonthOptions();
</SCRIPT>
</SELECT>
<SELECT NAME="secondYear" SIZE="1" onchange="return recalcDateDiff()">
<SCRIPT LANGUAGE="JavaScript">
writeOptions(1970,2010);
</SCRIPT>
</SELECT>
</P>
Total difference in days:
<INPUT TYPE="text" NAME="txtDays" VALUE="0" size="3">
<p>Your Age is:
<INPUT TYPE="text" NAME="age1" VALUE="0" size="2">
</p>
</FORM>
</BODY>
</HTML>

Output:
Form Validation using Java Script

Aim:

Algorithm:

Program:

signup.html

<html>
<head>
<title>Student Registration Form</title>
<script type="text/javascript">
function validate()
{
if(document.signup.fname.value=="")
{
alert("Please Enter First Name!");
return false;
}
if(document.signup.lname.value=="")
{
alert("Please Enter Last Name!");
return false;
}
if(document.signup.uname.value=="")
{
alert("Please Enter User Name!");
return false;
}
if(document.signup.pword1.value=="")
{
alert("Please Enter Password!");
return false;
}
if(document.signup.pword1.value.length<6)
{
alert("Please enter min 6 characters!");
return false;
}
if(document.signup.pword2.value=="")
{
alert("Please Enter Password again!");
return false;
}
if(document.signup.pword2.value!=document.signup.pword1.value)
{
alert("Password is mismatch. Re-enter password!");
return false;
}
alert("Details Entered Successfully");
display();

}
function display()
{
document.write('<h2>'+"Details Entered..."+'</h2>'+"First Name:
"+document.signup.fname.value+'<br/>'+"Last Name:
"+document.signup.lname.value+'<br/>'+"User Name:
"+document.signup.uname.value+'<br/>'+"Country:
"+document.signup.country.value+'<br/>'+"Alternate Email:
"+document.signup.aemail.value);
}
</script>
</head>
<body align="center" bgcolor="grey" >
<table width="100%" height="100%">
<td colspan="2" width="15%">
</td>
<td colspan="1" bgcolor="#FFFFFF" width="70%" height="100%">
<h1 align="center"><font color="#0066FF">SMail</font></h1>
<h2 align="center">
<font color="#0066FF">New User Signup Form</font></h2>
<form name="signup" onSubmit="return validate()">
<font face="Verdana, Arial, Helvetica, sans-serif" color="#660000" size="2">
<p>&nbsp;&nbsp;*First Name:<input type="text" name="fname"
size="20">&nbsp;&nbsp;*Last Name:
<input type="text" name="lname" size="20"> </p>
<p style=" border:">&nbsp;&nbsp;*User Name:
<input type="text" name="uname" size="20">@smail.com</p>
<p style=" border:">&nbsp;&nbsp;*Password :&nbsp;
<input type="password" name="pword1">(min 6 characters)</p>
<p style=" border:">&nbsp;&nbsp;*Confirm Password:
<input type="password" name="pword2" size="20"></p>
<p>&nbsp;&nbsp;Gender :
<input type="radio" name="gen" value="male">Male
<input type="radio" name="gen" value="female">Female
</p>
<p>&nbsp;&nbsp;Country:
<select name="country">
<option selected>Select Country</option>
<option name="country" value="india">India</option>
<option name="country" value="russia">Russia</option>
<option name="country" value="france">France</option>
<option name="country" value="italy">Italy</option>
</select>
</p>
<p>&nbsp;&nbsp;Language Known:<br/>&nbsp;&nbsp;
<input type="checkbox" name="lang" value="tamil">Tamil<br/>
&nbsp;&nbsp;
<input type="checkbox" name="lang" value="english">English<br/>
&nbsp;&nbsp;
<input type="checkbox" name="lang" value="hindi">Hindi<br/>
&nbsp;&nbsp;
<input type="checkbox" name="lang" value="Malayalam"> Malayalayam<br/>
</p>
<p style=" border:">&nbsp;&nbsp;Alternate Email:
<input type="text" name="aemail" size="20"></p>
<p align="center">
<input type="checkbox" name="agree" value="agree">
I agree the terms and conditions</p>
<p align="center"><input type="submit" value="Submit">
<input type="Reset" value="Reset"></p>
</font>
</form>
</td>
<td colspan="2" width="15%">
</td>
</table>
</body>
</html>

Output:
Result:

MARK LIST
AIM: To implement the JavaScript program to display the Student mark list.
PROCEDURE:
STEP 1: Start the program.

STEP 2: Declare the variables.

STEP 3: Get the students details and marks of 5 subjects of the students.

STEP 4: Sum the 5 subjects marks and calculate the average.

STEP 5: Then calculate the grade of the student.

STEP 6:Display the result.

SOURCE CODE:
<html>
<head>
<title>Selva marklist</title>
<script type = "text/javascript">
var sub1, sub2, sub3, sub4,sub5,n1,n2,n3,n4,n5,sum,avg,name,dept,y,s1;
name = window.prompt( "student name:", "0" );
dept = window.prompt( "department:", "0" );
y = window.prompt( "year:", "0" );
sub1 = window.prompt( "Enter first subject mark:", "0" );
sub2 = window.prompt( "Enter second subject mark:", "0" );
sub3 = window.prompt( "Enter third subject mark:", "0" );
sub4 = window.prompt( "Enter fourth subject mark:", "0" );
sub5 = window.prompt( "Enter fifeth subject mark:", "0" );
n1 = parseInt( sub1 );
n2 = parseInt( sub2 );
n3 = parseInt( sub3 );
n4 = parseInt( sub4 );
n5 = parseInt( sub5 );
document.writeln( "<h1>student marklist</h1>" );
document.writeln( "<br><b>NAME:"+name);
document.writeln( "<br>DEPARTMENT:"+dept);
document.writeln( "<br>YEAR:"+y);
document.writeln( "<br>MARKS:");
sum=n1+n2+n3+n4+n5;
avg=sum/5;
document.writeln("<table border = \"1\" width = \"100%\"cellspacing=\"2\">" );
document.writeln("<tr><th>subject name<th>marks</th></tr>");
document.writeln( "<tr><td> database management system<td>" +n1 + "</td></tr>");
document.writeln( "<tr><td> software engineering<td>" +n2 + "</td></tr>" );
document.writeln( "<tr><td> wireless communication <td>" +n3 + "</td></tr>" );
document.writeln( "<tr><td> web technology <td>" +n4 + "</td></tr>" );
document.writeln( "<tr><td> data mining <td>" +n5 + "</td></tr>" );
document.writeln( "<tr><td> total <td>" +sum+ "</td></tr>" );
document.writeln( "<tr><td> average <td>" +avg + "</td></tr>" );
if(avg>90)
document.writeln( "<tr><td> grade<td>s</td></tr>");
else if(avg>80)
document.writeln( "<tr><td> grade<td>a</td></tr>");
else if(avg>70)
document.writeln( "<tr><td> grade<td>b</td></tr>");
else
document.writeln( "<tr><td> grade<td>c</td></tr>");
document.writeln( "</table>" );
</script>
</head>
<body>
<p>Click Refresh (or Reload) to run the script again</p>
</body>
</html>
OUTPUT:

RESULT:
Thus JSP program for Marklist was successfully executed and verified.

Potrebbero piacerti anche