0% found this document useful (0 votes)

24 views83 pages

Dept HTML

Uploaded by

jahnaviravindrareddy7013

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as DOCX, PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

24 views83 pages

Dept HTML

Uploaded by

jahnaviravindrareddy7013

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as DOCX, PDF, TXT or read online on Scribd

You are on page 1/ 83

Dept.

html
Dec.html
Output:

Home.html:

Output:
Output:
WEEK 2: Write JavaScript to validate the following fields of the Registration page.

1. First Name (Name should contains alphabets and the length should not be less than 6

characters).

2. Password (Password should not be less than 6 characters length).

3. E-mail id (should not contain any invalid and must follow the standard pattern

[email protected])

4. Mobile Number (Phone number should contain 10 digits only).

5. Last Name and Address (should not be Empty).

AIM: To validate the fields of registration page using JavaScript

DESCRIPTION: In order to validate the fields of login and registration pages JavaScript is

used. JavaScript is programming code that can be inserted into HTML pages. JavaScript

inserted into HTML pages, can be executed by all modern web browsers. JavaScript is
mainly used for validating the elements in a form submitted by the user. This JavaScript code

can react to user events.

PROGRAM: After clicking OK button the page is redirected to success.html

<html>

<head><title>Registration Form Validation</title></head>

function formValidator()

// Make quick references to our fields

var firstname = document.getElementById('firstname');

var lastname = document.getElementById('lastname');

var email = document.getElementById('email');

var pass = document.getElementById('pass');

var addr = document.getElementById('addr');

var mobileno = document.getElementById('mobileno');

// Check each input in the order that it appears in the form!

if(notEmpty(firstname, "can not be null")){

if(isAlphabet(firstname, "Please enter only letters for your Firstname")){

if(lengthRestriction(firstname, 6)){

if(isAlphabet(lastname, "Please enter only letters for your Lastname")){

if(emailValidator(email, "Please enter a valid email address")){

if(lengthRestriction(pass, 6)){

if(isAlphanumeric(pass, "please enter Numbers and Letters Only for password")){

if(notEmpty(addr, "please enter the address")){

if(isNumeric(mobileno, "Please enter a valid mobileno")){

if(lengthRestriction1(mobileno, 10 , 10)){

return true;

} } } }

}
}

} } }

return false;

function notEmpty(elem, helperMsg){

if(elem.value.length == 0){

alert(helperMsg);

elem.focus(); // set the focus to this input

return false;

return true;

function isNumeric(elem, helperMsg){

var numericExpression = /^[0-9]+$/;

if(elem.value.match(numericExpression)){

return true;

}else{

alert(helperMsg);

elem.focus();

return false;

function isAlphabet(elem, helperMsg){

var alphaExp = /^[a-zA-Z]+$/;

if(elem.value.match(alphaExp)){

return true;

}else{

alert(helperMsg);

elem.focus();

return false;

}
}

function isAlphanumeric(elem, helperMsg){

var alphaExp = /^[0-9a-zA-Z]+$/;

if(elem.value.match(alphaExp)){

return true;

}else{

alert(helperMsg);

elem.focus();

return false;

function lengthRestriction(elem, min){

var uInput = elem.value;

if(uInput.length >= min){

return true;

}else{

alert("Please enter minimum " +min+ " characters");

elem.focus();

return false;

function emailValidator(elem, helperMsg)

var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;

if(elem.value.match(emailExp))

return true;

else{

alert(helperMsg);

elem.focus();
return false;

function lengthRestriction1(elem, min, max)

var uInput = elem.value;

if(uInput.length >= min && uInput.length <= max)

return true;

else {

alert("Please enter 10 numbers only");

elem.focus();

return false;

</script>

<center><font color="blue" size="6" face="arial">Registration Form</font></center><br />

<form onsubmit='return formValidator()' action="right.html">

First Name(Minimum 6 characters)<font color="red">* </font>

<input type='text' id='firstname' /><br /><br />

Last Name<font color="red"><font color="red">* </font> </font>    

<input type='text' id='lastname' /><br /><br />

Email Address<font color="red">* </font>    

<input type='text' id='email' /><br />

<font color="red">(one e-mail id only):</font>    

<font color="redblue">e.g. [email protected]</font><br /><br/>

Password(minimum 6 characters)<font color="red">* </font>    

<input type='password' id='pass'><br /><br/>

Address<font color="red">* </font>    

<textarea rows="2" cols="20" id='addr' /></textarea> <br /> <br/>

Mobile No<font color="red">* </font>    

<input type='text' id='mobileno' /><br />

Gender: <input type='radio' name="gender">male

<input type='radio' name="gender">female<br/><br />

<input type='Submit' value='submit' />

<input type='Reset' value='reset' />

</form>

</body>

</html>
WEEK - 3: Develop and demonstrate the usage of inline, internal and external style

sheet using CSS.

Aim: Design a web page using CSS which includes the following:

1) Use different font styles

2) Control the repetition of image with background-repeat and no-repeat property

3) Define style for links as a: link, a: active, a: hover, a: visited

4) Add customized cursors for links.

PROGRAM:

style.css

p.left

text-align:left;

color:blue;

font-family:Cambria;

font-size:large;

text-indent:20px;
}

p.center

text-align:center;

text-decoration:underline;

text-transform:uppercase;

letter-spacing:-3px;

word-spacing:20px;

font-size:larger;

p.right

text-align:right;

color:red;

font-family:Tahoma;

font-size:15pt;

text-decoration:overline;

font-style:italic;

b#headline

color:orange;

font-size:22px;

font-family:arial;

text-decoration:underline;

<html>

<head>

body
{

background-image:url('images/cse.png');

background-repeat:no-repeat;

background-position:center center;

background-attachment:fixed;

background-color:pink;

a:link { text-decoration:none;color:orange; }

a:visited { text-decoration:none;color:red; }

a:hover { text-decoration:underline;color:blue; }

a:active { text-decoration:underline;color:purple; }

h3 { color:green; }

.c1{cursor:crosshair}

.c2{cursor:pointer}

.c3{cursor:move}

.c4{cursor:text}

.c5{cursor:wait}

.c6{cursor:help}

</style>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

<h1 style="color:blue;text-align:center;"> CSS (Inline, Internal and External) </h1>

<p>This Paragraph is a Not Styled</p>

<p class="left">This Paragraph is Styled by class "Left"</p>

<p class="center">This Paragraph is Styled by class "Center"</p>

<p class="right">This Paragraph is Styled by class "Right"</p>

<b>This is normal Bold</b> <br>

<b id="headline">This Bold Text is Styled </b>

<h2><b><a href=" ">This is a link</a></b></h2>

<h3 class="c1">The cursor over this element is plus sign</h3>

<h3 class="c2">The cursor over this element is a pointing hand</h3>

<h3 class="c3">The cursor over this element is a grasping hand</h3>

<h3 class="c4">The cursor over this element is a I bar</h3>

<h3 class="c5">The cursor over this element is a wait</h3>

<h3 class="c6">The cursor over this element is a question mark</h3>

</html>

Output:

WEEK - 4: Develop and demonstrate JavaScript with POP-UP boxes and functions for

the following problems:

a) Input: Click on Display Date button using onclick( ) function

Output: Display date in the textbox

b) Input: A number n obtained using prompt

Output: Factorial of n number using alert

c) Input: A number n obtained using prompt

Output: A multiplication table of numbers from 1 to 10 of n using alert

d) Input: A number n obtained using prompt and add another number using confirm

Output: Sum of the entire n numbers using alert

PROGRAM:

a) date.html

<html>

<body>

function display(){

var x="You have clicked";

var d=new Date();

var date=d.getDate();

var month=d.getMonth();

month++;

var year=d.getFullYear();

document.getElementById("dis").value=date+"/"+month+"/"+year;

</script>

<form>

<input type="text" id="dis" /><br />

<input type="button" value="Display Date" onclick="display()" />

</form>

<body>

</html>

OUTPUT:

b) factorial.html
<html>

<head>

<title>factorial</title>

function factorialcalc()

number = parseint(prompt("enter a number, i'll calculate its factorial", "whole

numbers bigger than zero, please"))

factorial = 1

for (i=1; i <= number; i++)

factorial = factorial * i

alert("the factorial of " + number + " is " + factorial)

</script>

</head>

<input type=button value='factorial' onclick="factorialcalc();">

</form>

</body>

</html>
c) multable.html

<html>

<head><title> Multiplication Table </title></head>

<body>

<!--

var n=prompt("Enter positive value for n: "," ");

if(!isNaN(n)) {

var table="";

var number="";

for(i=1;i<=10;i++) {

number = n * i;

table += n + " * " + i + " = " + number + "\n";

alert(table);

else {

alert("Enter positive value");

n=prompt("Enter positive value for n: "," ");

}

document.write(n+" table values displayed using alert ..<br />");

// -->

</script>

</body>

</html>

OUTPUT:

d) sum of n numbers.html

<html>

<head><title>sum of n numbers using popup boxes</title>

function addsum()

alert("you're going to give me a list of numbers. i'm going to add them together for you");

var keepgoing = true

var sumofnums = 0

while (keepgoing) {

sumofnums = sumofnums + parseint(prompt("what's the next number to add?",""))

keepgoing = confirm("add another number?")

alert("the sum of all your numbers is " + sumofnums)

</script>

</head>

<body>

<input type=button value='sum of n numbers' onclick="addsum();">

</form>

</body>

</html>

OUTPUT:

WEEK - 5:

Write an HTML page that contains a selection box with a list of 5 countries. When the
user selects a country, its capital should be printed next in the list. Add CSS to

customize the properties of the font of the capital (color,bold and font size).

<html>

<head>

<title>WT Lab manual program no. 3</title>

</head>

<style>

color: red;

text-align: center;

.textbox1

color: blue;

font-size: 30px;

font-weight: bold;

</style>

<body>

<h1> Select the country name to find its capital</h1>

Select Country <select name="country" id="sbox1" onClick="myFunction()" required>

<option value="NEW DELHI">INDIA</option>

<option value="CANBERRA">AUSTRALIA</option>

<option value="WASHINGTON D.C">AMERICA</option>

<option value="LONDON">UNITEDKINGDOM</option>

<option value="BERLIN">GERMANY</option>

</select><br><br>
Capital <input type="text" class="textbox1" id="sbox2">

</form>

</center>

function myFunction()

{ var a=document.getElementById("sbox1").value;

document.getElementById("sbox2").value=a; }

</script> </body> </html>

Week - 6:

Write an HTML page including any required JavaScript that takes a number from text

field in the range of 0 to 999 and shows it in words. It should not accept four and above

digits, alphabets and special characters.

AIM: To convert number to words using JavaScript

PROGRAM:

0-999.html

<html>

<head>

<title>HTML - Convert numbers to words using JavaScript</title>

<!--

function isNumberKey(evt)

var charCode = (evt.which) ? evt.which : evt.keyCode;

if (charCode != 46 && charCode > 31

&& (charCode < 48 || charCode > 57))

return false;

return true;

//-->

</SCRIPT>

function NumToWord(inputNumber, outputControl)

var str = new String(inputNumber)

var splt = str.split("");

var rev = splt.reverse();

var once = ['Zero', ' One', ' Two', ' Three', ' Four', ' Five', ' Six', ' Seven', ' Eight', ' Nine'];

var twos = ['Ten', ' Eleven', ' Twelve', ' Thirteen', ' Fourteen', ' Fifteen', ' Sixteen', '

Seventeen', ' Eighteen', ' Nineteen'];

var tens = ['', 'Ten', ' Twenty', ' Thirty', ' Forty', ' Fifty', ' Sixty', ' Seventy', ' Eighty', '

Ninety'];

numLength = rev.length;

var word = new Array();

var j = 0;

for (i = 0; i < numLength; i++) {

switch (i) {

case 0:

if ((rev[i] == 0) || (rev[i + 1] == 1)) {

word[j] = '';

else {

word[j] = once[rev[i]];

word[j] = word[j];

break;
case 1:

aboveTens();

break;

case 2:

if (rev[i] == 0) {

word[j] = '';

else if ((rev[i - 1] == 0) || (rev[i - 2] == 0)) {

word[j] = once[rev[i]] + " Hundred ";

else {

word[j] = once[rev[i]] + " Hundred and";

break;

default: break;

j++;

function aboveTens() {

if (rev[i] == 0) { word[j] = ''; }

else if (rev[i] == 1) { word[j] = twos[rev[i - 1]]; }

else { word[j] = tens[rev[i]]; }

word.reverse();

var finalOutput = '';

for (i = 0; i < numLength; i++) {

finalOutput = finalOutput + word[i];

document.getElementById(outputControl).innerHTML = finalOutput;

</script>
</head>

<body>

<h1>HTML - Convert numbers to words using JavaScript</h1>

<input id="Text1" type="text" onkeypress="return isNumberKey(event)"

onkeyup="NumToWord(this.value,'divDisplayWords');" maxlength="3" style="background

color: #efefef; border: 2px solid #CCCCC; font-size: large" />

<br /> <br />

<div id="divDisplayWords" style="font-size: 30; color: Teal; font-family: Arial;">

</div>

</body>

</html>

OUTPUT:

WEEK - 7: Develop and demonstrate PHP Script for the following problems:

a) Write a PHP Script to find out the Sum of the Individual Digits.

b) Write a PHP Script to check whether the given number is Palindrome or not

a) Find out Sum of the individual Digits

<?php

$n=323;

$sum=0;

while($n>0)

$r=$n%10;

$sum+=$r;

$n=$n/10;

echo "sum of individual digits are: $sum";

?>
Output:

b) Check whether the given number is Palindrome or not

<?php

$n=323;

$t=$n;

$rev=0;

while($n>0)

$r=$n%10;

$rev=$rev*10+$r;

$n=(int)($n/10);

echo "Reverse digits are: $rev <br>";

if($t==$rev)

echo "$rev is a Palindrome";

else

echo "$rev is not a Palindrome";

?>
Output:

Week - 8:

Create an XML document that contains 10 users information. Write a Java Program,

which takes User Id as input and returns the user details by taking the user information

from XML document using DOM parser or SAX parser.

AIM: Takes User Id as input and returns the user details using XML with DOM

PROGRAM:

users.xml

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>
</user>

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>
<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>

<user>

<college>mrcet</college>

</user>

</usersinformation>

UserDom.java

import java.io.File;

import javax.xml.parsers.*;

import org.w3c.dom.*;

import java.util.Scanner;

public class UserDom

public static void main(String args[]) throws Exception

DocumentBuilderFactory fac=DocumentBuilderFactory.newInstance();

DocumentBuilder b=fac.newDocumentBuilder();

Document doc=b.parse(new File("users.xml"));

doc.getDocumentElement().normalize();

Element root=doc.getDocumentElement();

Scanner in=new Scanner(System.in);

System.out.println("Enter User ID:");

int n=in.nextInt();

int flag=0;

NodeList nl=doc.getElementsByTagName("user");

for(int i=0;i<nl.getLength();i++)

Node node=nl.item(i);

if(node.getNodeType()==Node.ELEMENT_NODE)

Element e=(Element)node;

int

x=Integer.parseInt(e. getElementsByTagName("rollno").item(0).getTextContent());

if(x==n)

System.out.println(root.getNodeName());

System.out.println("--------------------------------");

System.out.println("rollno:\t"+e.getElementsByTagName("rollno").item(0).getTextContent());

System.out.println("name:\t"+e.getElementsByTagName("name").item(0).getTextContent());

System.out.println("branch:\t"+e.getElementsByTagName("branch").item(0).getTextContent());

System.out.println("college:"+e.getElementsByTagName("college").item(0).getTextContent());

flag=1;

break;

else

flag=0;

}
}

if(flag==0)

System.out.println("User not available");

OUTPUT:

WEEK - 9:

Implement the following web applications using (a) PHP, (b) Servlets and (c) JSP.

9 (i) (a). A web application that takes a name as input and on submit it shows a hello

<name> page where name is taken from the request. It shows the start time at the right

top corner of the page and provides a logout button. On clicking this button, it should

show a logout page with Thank You <name > message with the duration of usage (hint:

Use session to store name and time).

AIM: To design an application that use session to store data.

PROGRAM:

<html>

<form action="home.php" method="post">

Username<input type="text" name="text1"><br>

<input type="submit" value="SignIn" name="submit">

</form>

</html>

Output of login.html:

Home.php:

<?php

session_start();

date_default_timezone_set("Asia/Calcutta");

$_SESSION['luser'] = $_POST['text1'];

$_SESSION['start'] = time();

$tm=$_SESSION['start'];

print "<p align='right'>Session started at " . date("h:i:sa",$tm) . "<br>";

print "<form action='logoutpage.php' method='post'>";

print "<input type='submit' value='Logout'></p>";

print "</form>";

print "Hello " . $_SESSION['luser'];

Logoutpage.php:

<?php

session_start();
date_default_timezone_set("Asia/Calcutta");

print "<p align='right'>Session started at " . date("h:i:sa",time()) . "</p><br>";

print "Thank you " . $_SESSION['luser'];

$sessiontime = time() - $_SESSION['start'];

print "<br> Your session duration: " . $sessiontime . " seconds";

session_destroy();

Output of Logoutpage.php

9 (ii) (a). Write a PHP Program to display current Date, Time and Day using PHP

Script.

AIM: To display current date , Time and Day using PHP.

PROGRAM:

date.php

<?php

date_default_timezone_set ("Asia/Calcutta");

echo "Date: ";

echo date("d/m/y");

echo "<br> Time: ";

echo date(" H:i:s A", time());

echo "<br> Day: ";

$day=date("l");
echo $day;

Output:

9 (iii) (a). A web application that takes name and age from an HTML page. If the age is

less than 18, it should send a page with “Hello <name>, you are not authorized to visit

the site” message, where <name> should be replaced with the entered name. Otherwise

it should send “Welcome <name> to this site” message.

AIM: To design an application to validate age are less than 18 or more than 18 using PHP.

PROGRAM:

checkage.html

<html>

<form action='home.php' method='post'>

<center><b><font color="blue" size="10">Login</font></b></center><br><br>

User name: <input type='text' name='name'><br>

age: <input type='text' name='age'><br>

</form>

</body>

</html>

home.php
<?php

$name = $_POST['name'];

$age = $_POST['age'];

if ($age < 18)

print "Hello " . $name . " you are not authorized to visit this site.";

else

print "Welcome " . $name . " to this site."

Output:

9 (iv) (a). A web application that lists all cookies stored in the browser on clicking “List

Cookies” button. Add cookies if necessary.

AIM: To design an application to develop cookies using PHP.

PROGRAM:

cookieset.php

<html>

<head> <title> User Acess </title> </head>

<body bgcolor="bisque"> <br>

<?php

$firstname = 'aaa';

$middlename = 'bbb';

$lastname = 'ccc';
setcookie('first_name',$firstname,time() + 86400);

setcookie('middle_name',$middlename,time() + 86400);

setcookie('last_name',$lastname,time() + 86400);

print "cookies set";

</center>

</body>

</html>

Output:

ListCookie.php

<html>

<head> <title> Cookie </title> </head>

<form action="" method="post">

<input type="submit" value="LIST COOKIES" name="list">

</form>

</center>

<?php

error_reporting(0);

if($_POST['list'])

foreach($_COOKIE as $key=>$val)

echo "<center>".$key." is ".$val."<br>

</center>";

</body>

</html>

Output:

9 (i) (b). A web application that takes a name as input and on submit it shows a hello

<name> page where name is taken from the request. It shows the start time at the right

top corner of the page and provides a logout button. On clicking this button, it should

show a logout page with Thank You <name > message with the duration of usage (hint:

Use session to store name and time).

USING SERVLET

Session1.html

<html>

<head> <title> SESSION LOGIN </title> </head>

<body>

<form action="http://localhost:8080/Session1/session6vib" method="get">

Enter Name: <input type="text" name="uname"> <br>

<input type="submit" value="LOGIN" name="register">

</form>

</center>

</body>

</html>

Session1.java

import javax.servlet.*;

import javax.servlet.http.*;

import java.io.*;

import java.util.*;

public class Session1 extends HttpServlet

public void doGet(HttpServletRequest req, HttpServletResponse res) throws IOException,

ServletException

try

res.setContentType("text/html");

PrintWriter out=res.getWriter();

out.println("<form method=get action=session26vib>");

Date d=new Date();

out.println("<p align=right> Time:"+d.getTime()+"</p>");

String un=req.getParameter("uname");

HttpSession session=req.getSession();

session.setAttribute("user",un);

session.setAttribute("time",d.getTime());

out.println("Hello\t"+un);

out.println("<br><br> <input type=submit value=logout>");

out.println("</form");

}
catch(Exception e)

e.printStackTrace();

} }

Session2.java

import javax.servlet.*;

import javax.servlet.http.*;

import java.io.*;

import java.util.*;

public class Session2 extends HttpServlet

public void doGet(HttpServletRequest req, HttpServletResponse res) throws IOException,

ServletException

try

res.setContentType("text/html");

PrintWriter out=res.getWriter();

HttpSession session=req.getSession();

Date d2=new Date();

String un=(String)session.getAttribute("user");

Long t1=(Long)session.getAttribute("time");

Long t2=d2.getTime();

session.invalidate();

out.println("Thank you\t"+un);

out.println("<br><br> Session duration: '"+(t2-t1)/(60*60)+"'seconds");

catch(Exception e)

e.printStackTrace();
}

web.xml

<?xml version="1.0"?>

<web-app>

<servlet-name>session1</servlet-name>

<servlet-class>Session1</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>session1</servlet-name>

<url-pattern>/session6vib</url-pattern>

</servlet-mapping>

<servlet-name>session2</servlet-name>

<servlet-class>Session2</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>session2</servlet-name>

<url-pattern>/session26vib</url-pattern>

</servlet-mapping>

</web-app>
Aim: To print Current date and time using Servlet.

USING SERVLET
DateSrv.java

import java.io.*;

import javax.servlet.*;

public class DateSrv extends GenericServlet

//implement service()

public void service(ServletRequest req, ServletResponse res) throws IOException,

ServletException

//set response content type

res.setContentType("text/html");

//get stream obj

PrintWriter pw = res.getWriter();

//write req processing logic

java.util.Date date = new java.util.Date();

pw.println("<h2>"+"Current Date & Time: " +date.toString()+"</h2>");

//close stream object

pw.close();

web.xml

<?xml version="1.0"?>

<web-app>

<servlet-name>Date</servlet-name>

<servlet-class>DateSrv</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>Date</servlet-name>

<url-pattern>/date</url-pattern>
</servlet-mapping>

</web-app>

Output:

9 (iii) (b). A web application that takes name and age from an HTML page. If the age is

less than 18, it should send a page with “Hello <name>, you are not authorized to visit

the site” message, where <name> should be replaced with the entered name. Otherwise

it should send “Welcome <name> to this site” message.

AIM: To design an application to validate age are less than 18 or more than 18 using SERVLET.

USING SERVLET

index.html:

<html

<head>

<title>VoterApp</title>

</head>

<body>

<form action= "http://localhost:8080/CheckAge/check" method="get">

<fieldset style="width:20%; background-color:#80ffcc">

<table>

<tr><td>Name</td><td><input type="text" name="name"></td></tr>

<tr><td>Age</td><td><input type="text" name="age"></td></tr>

<td><input type = "submit" value="Check Eligibility"></td></tr>

</table>

</fieldset>

</form>
</body>

</html>

VoterSrv.java:

import java.io.*;

import java.util.*;

import javax.servlet.*;

import javax.servlet.http.*;

public class VoterSrv extends HttpServlet

public void service(HttpServletRequest req, HttpServletResponse res) throws

IOException,ServletException

//set response content type

res.setContentType("text/html");

//get printWrite obj

PrintWriter pw = res.getWriter();

//read form data from page as request parameter

String name = req.getParameter("name");

int age = Integer.parseInt(req.getParameter("age"));

if (age>=18)

pw.println("<font color='green' size='4'>Welcome "+name+" to this site</font>");

else

pw.println("<font color='red' size='4'>Hello "+name+", you are not authorized tovisit the
site</font>");

//add hyperlink to dynamic page

pw.println("<br><br><a href= 'index.html'>back</a>");

//close the stream

pw.close();

}
}

web.xml:

<web-app>

<servlet-name>abc</servlet-name>

<servlet-class>VoterSrv</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>abc</servlet-name>

<url-pattern>/check</url-pattern>

</servlet-mapping>

</web-app>

Output:

9 (iv) (b). A web application that lists all cookies stored in the browser on clicking “List
Cookies” button. Add cookies if necessary.

AIM: To design an application to develop cookies using Servlet.

USING SERVLET

index.html

<html>

<head>

<title>CookiesExample</title>

</head>

<body>

<form method='get' action='http://localhost:8080/MyServlet1/login'>

<fieldset style="width:14%; background-color:#ccffcc">

User Name:<input type="text" name="Name"/><br/>

Password:<input type="password" name="Password"/><br/>

<input type="submit" value="submit"/>

</form>

</fieldset>

</form>

</body>

</html>

MyServlet1.java

import java.io.*;

import javax.servlet.*;

import javax.servlet.http.*;

public class MyServlet1 extends HttpServlet

public void doGet(HttpServletRequest request, HttpServletResponse response) {

try{

response.setContentType("text/html");

PrintWriter pwriter = response.getWriter();

String uname = request.getParameter("Name");

String upassword = request.getParameter("Password");

pwriter.print("Cookies Set:<br>Hello "+uname);

pwriter.print("<br>Your Password is: "+upassword);

//Creating two cookies

Cookie c1=new Cookie("Name",uname);

Cookie c2=new Cookie("Password",upassword);

//Adding the cookies to response header

response.addCookie(c1);

response.addCookie(c2);

pwriter.print("<br><a href='welcome'>LIST COOKIES</a>");

pwriter.close();

}catch(Exception exp){

System.out.println(exp);

MyServlet2.java

import java.io.*;

import javax.servlet.*;

import javax.servlet.http.*;

public class MyServlet2 extends HttpServlet {

public void doGet(HttpServletRequest request,

HttpServletResponse response){

try{

response.setContentType("text/html");

PrintWriter pwriter = response.getWriter();

//Reading cookies

Cookie c[]=request.getCookies();

//Displaying User name and User Password value from cookie

for(int i=0;i<c.length;i++){
pwriter.print("<br>"+c[i].getName()+": "+c[i].getValue());//printing name and value of

pwriter.close();

}catch(Exception exp){

System.out.println(exp);

web.xml

<web-app>

<display-name>Cookies Example</display-name>

<welcome-file-list>

<welcome-file>index.html</welcome-file>

</welcome-file-list>

<servlet-name>Servlet1</servlet-name>

<servlet-class>MyServlet1</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>Servlet1</servlet-name>

<url-pattern>/login</url-pattern>

</servlet-mapping>

<servlet-name>Servlet2</servlet-name>

<servlet-class>MyServlet2</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>Servlet2</servlet-name>

<url-pattern>/welcome</url-pattern>

</servlet-mapping>
</web-app>

9 (i) (c). A web application that takes a name as input and on submit it shows a hello

<name> page where name is taken from the request. It shows the start time at the right

top corner of the page and provides a logout button. On clicking this button, it should

show a logout page with Thank You <name > message with the duration of usage

(hint: Use session to store name and time).

USING JSP

Sessionjsp.html

<html>

<head> <title> SESSION LOGIN </title> </head>

<body>

Enter Name: <input type="text" name="uname"> <br>

<input type="submit" value="LOGIN" name="register">

</form>

</center>

</body>

</html>

Session1.jsp

<%@page language="java" import="java.util.*" errorPage=""%>

<form method="get" action="http://localhost:8080/jsp/Session2.jsp">

Date d=new Date();

<p align="right"> Time;<%=d.getTime()%></p>

String un=request.getParameter("uname");

session.setAttribute("user",un);

session.setAttribute("time",d.getTime());

Hello <%=un%>

<input type="submit" value="logout">

</form>

Session2.jsp

<%@page language="java" import="java.util.*" errorPage=""%>

Date d2=new Date();

String un=(String)session.getAttribute("user");

Long t1=(Long)session.getAttribute("time");

Long t2=d2.getTime();

%>
Thank you <%=un%>

Session duration: <%=(t2-t1)/(60*60)%> seconds

<% session.invalidate();%>

9 (ii) (b). Write a JSP application to print the current date and time.

Aim: To print Current date and time using JSP.

USING JSP

test.jsp

<html>

<head><title>JSPApp</title></head>

<body>

<form>

<fieldset style="width:50%; background-color: #ccffeb;">

<legend><b><i>JSP Application<i><b></legend>

<h3>Current Date and Time is :</h3>

<% java.util.Date d = new java.util.Date();

out.println(d.toString()); %>

</fieldset>

</form>

</body>

</html>

Output:

9 (iii) (c). A web application that takes name and age from an HTML page. If the age is

less than 18, it should send a page with “Hello <name>, you are not authorized to visit

the site” message, where <name> should be replaced with the entered name. Otherwise
it should send “Welcome <name> to this site” message.

AIM: To design an application to validate age are less than 18 or more than 18 using JSP.

USING JSP

UserEligibility.html:

<html>

<head> <title> User Acess </title> </head>

<h1> USER ELIGIBILITY </h1>

<form action="http://localhost:8080/jsp/checkage.jsp" method="get">

<input type="text" name="uname" placeholder="Enter your name"> <br>

<input type="text" name="uage" placeholder="Enter your age"> <br>

<input type="submit" value="submit" name="sub"<>

</form>

</center>

</body>

</html>

checkage.jsp:

<%@page language="java" import="java.sql.*" errorPage=""%>

String name;

int age;

name=request.getParameter("uname");

age=Integer.parseInt(request.getParameter("uage"));

if(age<=18)

out.println("<h1> Hello\t " +name+"\t you are not eligible </h1>");

else

out.println("<h1> Welcome " +name+" to this site </h1>");

}

%>
9 (iv) (c). A web application that lists all cookies stored in the browser on clicking “List

Cookies” button. Add cookies if necessary.

AIM: To design an application to develop cookies using JSP.

USING JSP

cookie.html

<html>

<head> <title> Calculator </title> </head>

<body>

<form action="http://localhost:8080/jsp/cookie1.jsp" method="post">

Enter your name:<input type="text" name="name1" placeholder="Enter name">

<input type="submit" value="Add cookie">

</form>

</center>

</body>

</html>

cookie1.jsp
<%@page language="java" import="java.sql.*" errorPage=""%>

String name=request.getParameter("name1");

Cookie c1=new Cookie ("firstname",name);

response.addCookie(c1);

c1.setMaxAge(50*50);

<form method="get" action="http://localhost:8080/jsp/cookie2.jsp">

<input type="submit" value="List Cookies">

</form>

cookie2.jsp

<%@page language="java" import="java.sql.*" errorPage=""%>

<title> List of Cookies </title>

<h1> List of Cookies </h1>

Cookie[] cookies=request.getCookies();

</tr>

out.println("<td> Cookie Name </td> <td> Cookie value </td>");

for(int i=0;i<cookies.length;i++)

out.println("<h2> <tr> <td>

"+cookies[i].getName()+"</td><td>"+cookies[i].getValue()+"</td></tr>");

</tr>

</table>
WEEK - 10: Implement the web applications with Database using

(a) PHP, (b) Servlets and (c) JSP.

a) A user validation web application, where the user submits the login name &

password to the server. The name and password are checked against the data already

available in Database and if the data matches, a successful login page is returned.

Otherwise failure message is shown to the user.

AIM: To design an application that verifies user details from database using PHP.

PROGRAM:

db.php

<html>

<body>

<?php

$severname="localhost";

$username="root";

$password="TIGER";

$conn=new mysqli($severname,$username,$password);

if($conn->connect_error)

die("connection failed".$conn->connect_error);

echo "Connected successfully <br>";

//Create database

$sql = "CREATE DATABASE reg";

if(mysqli_query($conn,$sql))

echo "Database created successfully<br>";

else

echo "error";

$servername="localhost";

$dbname="reg";

$conn = mysqli_connect($servername, $username, $password, $dbname);

// Check connection

if (!$conn)

die("Connection failed: " . mysqli_connect_error());

echo "Connected successfully <br>";

// sql to create table

$sql = "CREATE TABLE Guests (

name VARCHAR(30) NOT NULL,

pwd VARCHAR(30) NOT NULL)";

if (mysqli_query($conn, $sql))

echo "Table MyGuests created successfully<br>";

else {

echo "Error creating table: " . mysqli_error($conn);

$sql = "INSERT INTO Guests (name, pwd) VALUES ('cse', '5')";

if (mysqli_query($conn, $sql)) {

echo "New record created successfully";

else

echo "Error: " . $sql . "<br>" . mysqli_error($conn);

mysqli_close($conn);

</body>

</html>

Output of db.php:
Login.html

<html>

<head> <title> Login Page </title> </head>

<body>

<center> <h1> Login Page </h1>

<form action="loginform.php" method="post">

<table>

<tr> <td> <label> Name: </label> </td>

<td> <input type="text" name="uname" /> </td>

</tr>

<tr> <td> <label> Password: </label> </td>

<td> <input type="password" name="upwd" /> </td>

</tr>

<tr> <td> <input type="submit" value="submit" /> </td>

<td> <input type="reset" value="reset" /> </td>

</tr>

</table>

</form>

</center>

</body>

</html>
loginform.php

<html>

<head> <title> Registration page </title> </head>

<body>

<?php

$name=$_POST["uname"];

$pwd=$_POST["upwd"];

$conn=mysql_connect("localhost","root","TIGER") or die("mysql_error()");

mysql_select_db("reg") or die("mysql_error()");

$query=mysql_query("SELECT * from guests where name='$name'");

while($row=mysql_fetch_array($query))

$duser=$row['name'];

$dpwd=$row['pwd'];

if($pwd==$dpwd && $name==$duser)

echo "welcome $name branch";

else

echo "invalid user";

</body>

</html>

OUTPUT:
(b) USING SERVLET

DBExample.java

import java.io.*;

import javax.servlet.*;

import javax.servlet.http.*;

import java.util.*;

import java.sql.*;

public class DBExample extends HttpServlet{

public void doGet(HttpServletRequest request,

HttpServletResponse response)

throws ServletException, IOException

String JDBC_DRIVER="com.mysql.jdbc.Driver";

String DB_URL="jdbc:mysql://localhost/csec";

String USER = "root";

String PASS = "TIGER";

response.setContentType("text/html");
PrintWriter out = response.getWriter();

out.println("<html><body><h1>Welcome to MRCET</h1>\n") ;

try{

Class.forName("com.mysql.jdbc.Driver");

Connection conn = DriverManager.getConnection(DB_URL,

USER, PASS);

Statement stmt = conn.createStatement();

String sql;

sql = "SELECT * FROM Emp";

ResultSet rs = stmt.executeQuery(sql);

while(rs.next()){

out.println("ID: " + rs.getString(1));

out.println("Age: " + rs.getString(2));

out.println("First Name: " + rs.getString(3)+"<br>");

rs.close();

stmt.close();

conn.close();

}catch(SQLException se){

out.println(se.getMessage());

}catch(Exception e){

out.println(e.getMessage());

out.println("</body></html>");

<?xml version="1.0" encoding="UTF-8"?>

<web-app>

<servlet-name>DBExample</servlet-name>
<servlet-class>DBExample</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>DBExample</servlet-name>

<url-pattern>/db</url-pattern>

</servlet-mapping>

</web-app>

OUTPUT:

(c) USING JSP

import java.sql.*;

class MysqlCon{

public static void main(String args[]){

try{

Class.forName("com.mysql.jdbc.Driver");

Connection con=DriverManager.getConnection(

"jdbc:mysql://localhost:3306/sonoo","root","root");

//here sonoo is database name, root is username and password

Statement stmt=con.createStatement();

ResultSet rs=stmt.executeQuery("select * from emp");

while(rs.next())

System.out.println(rs.getInt(1)+" "+rs.getString(2)+" "+rs.getString(3));

con.close();

}catch(Exception e){ System.out.println(e);}

OUTPUT:

WEEK - 11:

Modify the above PHP program to use an xml instead of database

AIM: To design an application that verifies user details from an xml using PHP.

PROGRAM:

db.php

Userlogin.xml:

<user>

</user>

<user>

<username>mrcet</username>
<password>mlrd</password>

</user>

</Authentication>

Loginform.php:

<html>

<head>

<title> Registration page </title>

</head>

<?php

$myxml=simplexml_load_file("Userlogin.xml");

$username=$_POST['uname'];

$password=$_POST['upwd'];

$xmlusername="";

$xmlpassword="";

for($i=0;$i<count($myxml);$i++)

$xmlusername=$myxml->user[$i]->username;

$xmlpassword=$myxml->user[$i]->password;

if($xmlusername==$username && $xmlpassword==$password)

echo "welcome $username";

die();

echo "Invalid username or password";

</body>

</html>

Loginform.php:

<html>
<head> <title> Login Page </title> </head>

<h1> Login Page </h1>

<form action="Loginform.php" method="post">

<table>

<tr> <td> <label> Name: </label> </td>

<td> <input type="text" name="uname" /> </td>

</tr>

<tr> <td> <label> Password: </label> </td>

<td> <input type="password" name="upwd" /> </td>

</tr>

<tr> <td> <input type="submit" value="submit" />

</td>

<td> <input type="reset" value="reset" /> </td>

</tr>

</table> </form> </center> </body> </html>

OUTPUT:

WEEK - 12:

Write a program to design a simple calculator using (a) JavaScript (b) PHP (c) Servlet

and (d) JSP.

(a) USING JavaScript

AIM: To design a simple calculator using JAVASCRIPT.

PROGRAM:

cal.html

<html>

<head>

<title>Calculator</title>

function updatestring(value)

inputstring=inputstring+value;

document.calculator.input.value=inputstring;

</script>

</head>

<body>

<table border="4" align="center" bgcolor="pink" bordercolor="black">

<tr>

<td colspan="4"><input type="text" name="input" maxlength="15" size="27"></td> </tr>

<tr> <td><input type="button" value="clear" onclick="input.value=' ';inputstring=' ' "></td>

<td><input type="button" value="mod" onclick="updatestring('%')"></td>

<td><input type="button" value="" onclick="updatestring('')"> </td> </tr>

<tr>

<td><input type="button" value="7" onclick="updatestring('7')"> </td>

<td><input type="button" value="8" onclick="updatestring('8')"> </td>

<td><input type="button" value="9" onclick="updatestring('9')"> </td>

<td><input type="button" value="/" onclick="updatestring('/')"> </td> </tr>

<tr>

<td><input type="button" value="4" onclick="updatestring('4')"> </td>

<td><input type="button" value="5" onclick="updatestring('5')"> </td>

<td><input type="button" value="6" onclick="updatestring('6')"> </td>

<td><input type="button" value="-" onclick="updatestring('-')"> </td> </tr>

<tr>

<td><input type="button" value="1" onclick="updatestring('1')"> </td>

<td><input type="button" value="2" onclick="updatestring('2')"> </td>

<td><input type="button" value="3" onclick="updatestring('3')"> </td>

<td><input type="button" value="+" onclick="updatestring('+')"> </td> </tr>

<tr>

<td><input type="button" value="0" onclick="updatestring('0')"> </td>

<td><input type="button" value="00" onclick="updatestring('00')"> </td>

<td><input type="button" value="." onclick="updatestring('.')"> </td>

<td><input type="button" value="=" onclick="input.value=eval(inputstring);"> </td> </tr>

</table> </form> </body> </html>

(b) USING PHP

AIM: To design an application that works as a simple calculator using PHP.

PROGRAM:
form.html

<html>

<head> <title> scientific calculator </title> </head>

<body bgcolor="bisque"> <br>

<form name='f1' action='add.php' method='post'>

1st Number<input type='text' name='t1'><br>

2nd Number<input type='text' name='t2'><br>

<input type='submit' name='add' value='add'>

<input type='submit' name='sub' value='sub'>

<input type='submit' name='mul' value='mul'>

<input type='submit' name='div' value='div'>

</form>

</body>

</html>

add.php

<?php

$a = $_POST['t1'];

$b = $_POST['t2'];

if (isset($_POST['add']))

$c = $a + $b;

print $a . "+" . $b . "=" . $c;

if (isset($_POST['sub']))

$c = $a - $b;

print $a . "-" . $b . "=" . $c;

if (isset($_POST['mul']))
{

$c = $a * $b;

print $a . "*" . $b . "=" . $c;

if (isset($_POST['div']))

$c = $a / $b;

print $a . "/" . $b . "=" . $c;

?>
(c) USING SERVLETS

AIM: Develop Servlet Application of Basic Calculator(+,-,*,/,%) using ServletInputStream

and ServletOutputStream.

DESCRIPTION:

In java with using 2 operant’s and 1 operator we can calculate the basic mathematically

operation such as addition, subtraction, multiplication, division Servlet is a Java class which

extends the capabilities of server that provides the application accessed by means of request

response model. It uses two interfaces i.e. HTTPRequest & HTTPResponse

HTTPRequest: This is an interface which provides methods for extracting HTTP parameters

from the query or request body depending on the type of request i.e. get or post

HTTPResponse: This interface provides an OutputStream for retrieving information such as

images or PrintWriter for retrieving text output.

PROGRAM:

index.html

<html>

<head>

<title>Simple Calculator</title>

</head>

<body>

<h3>Please Enter Two Numbers :::</h3>

<form method="GET" action="http://localhost:8080/Cal/calc">

Number:<input type="text" id="t1" name="t1"/><br/>

</select></br>

Number:<input type="text" id="t2" name="t2">

<input type="submit" value="calculate"/></br>

</form>

</body>

</html>

Cal.java

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class Cal extends HttpServlet

public void doGet(HttpServletRequest request, HttpServletResponse response) throws

ServletException, IOException {

response.setContentType("text/html;charset=UTF-8");

PrintWriter pw= response.getWriter();

int n1 = Integer.parseInt(request.getParameter("t1"));

int n2 = Integer.parseInt(request.getParameter("t2"));

String op=request.getParameter("op");

if(op.equals("+")){pw.println("Addition :::"+(n1+n2));}

else if(op.equals("-")){pw.println("Subtraction :::"+(n1-n2));}

else if(op.equals("")){pw.println("Multiplication :::"+(n1n2));}

else if(op.equals("/")){pw.println("Division :::"+(n1/n2));}

else{pw.println("Remainder :::"+(n1%n2));}

pw.close();

}}

web.xml

<web-app>

<servlet-name>Calculator</servlet-name>

<servlet-class>Cal</servlet-class>
</servlet>

<servlet-mapping>

<servlet-name>Calculator</servlet-name>

<url-pattern>/calc</url-pattern>

</servlet-mapping>

</web-app>

Output:

(d) USING JSP

Aim: To design a calculator using JSP.

calculator.html

<html>

<title>calculator</title>

<head><h1><center>Basic Calculator</center></h1></head>

<body>

<form action="http://localhost:8080/jsp/calculator.jsp" method="get">

<label for="num1"><b>Number 1</b></label>

<label for = "num2"><b>Number 2</b></label>

<input type="text" name="num2"><br><br>

<input type ="radio" name = "r1" value="Add">+

<input type = "radio" name = "r1" value="Sub">-<br>

<input type="radio" name="r1" value ="mul">*

<input type = "radio" name="r1" value="div">/<br><br>

<input type="submit" value="submit">

</center>

</body>

</html>

calculator.jsp

<html>

<title>calculator</title>

<body>

<%@page language="java"%>

int num1 = Integer.parseInt(request.getParameter("num1"));

int num2 = Integer.parseInt(request.getParameter("num2"));

String operation = request.getParameter("r1");

if(operation.equals("Add")){

int add=num1+num2;

out.println("Addition is: "+add);

else if(operation.equals("Sub")){

int sub=num1-num2;

out.println("Substraction is: "+sub);

else if(operation.equals("mul")){

int mul=num1*num2;
out.println("multiplication is: "+mul);

else if(operation.equals("div"))

int div = num1/num2;

if(num1>=num2)

out.println("division is: "+div);

else

out.println("The division cannot be performed");

</body>

</html>

OUTPUT:

LAB
No ratings yet
LAB
15 pages
JavaScript Form & Validation Guide
No ratings yet
JavaScript Form & Validation Guide
9 pages
Web Tech Coding 002
No ratings yet
Web Tech Coding 002
33 pages
Exp-7 & EXP-9
No ratings yet
Exp-7 & EXP-9
25 pages
AIM: / Validating A Registration Form Using Java Script
No ratings yet
AIM: / Validating A Registration Form Using Java Script
20 pages
WEEK-5 F
No ratings yet
WEEK-5 F
20 pages
HTML B.scprograms
No ratings yet
HTML B.scprograms
55 pages
Q10
No ratings yet
Q10
13 pages
MC4212 Full Stack Web Development Lab
No ratings yet
MC4212 Full Stack Web Development Lab
24 pages
Web Design
No ratings yet
Web Design
30 pages
Program 2
No ratings yet
Program 2
4 pages
Web Essential Observation
No ratings yet
Web Essential Observation
44 pages
WEb Essentials Anna University Laboratory
No ratings yet
WEb Essentials Anna University Laboratory
47 pages
Web Design & JS Validation Basics
No ratings yet
Web Design & JS Validation Basics
6 pages
Code
No ratings yet
Code
9 pages
Model Question
No ratings yet
Model Question
6 pages
WT Lab..
No ratings yet
WT Lab..
15 pages
Web PRGM Manual
No ratings yet
Web PRGM Manual
20 pages
Web Tech Practical
No ratings yet
Web Tech Practical
40 pages
Web-Tech-Practical (1) - 1-24
No ratings yet
Web-Tech-Practical (1) - 1-24
24 pages
Java Script Assg
No ratings yet
Java Script Assg
21 pages
Js Program
No ratings yet
Js Program
18 pages
JWT Labmanual For MTech FINAL One
No ratings yet
JWT Labmanual For MTech FINAL One
79 pages
Simple Lab
No ratings yet
Simple Lab
19 pages
WT Past Paper Sol
No ratings yet
WT Past Paper Sol
8 pages
Web Tech File
No ratings yet
Web Tech File
25 pages
JavaScript Web Development Tasks
No ratings yet
JavaScript Web Development Tasks
21 pages
WEB DEV Arman Ansari
No ratings yet
WEB DEV Arman Ansari
39 pages
Exp 6-13
No ratings yet
Exp 6-13
28 pages
Validation (6) HTML
No ratings yet
Validation (6) HTML
3 pages
1) Create A Form Having Number of Elements (Textboxes, Radio Buttons, Checkboxes, and So On) - Write A Javascript Code To Count The Number of Elements in A Form
100% (2)
1) Create A Form Having Number of Elements (Textboxes, Radio Buttons, Checkboxes, and So On) - Write A Javascript Code To Count The Number of Elements in A Form
32 pages
Bikesh Shrestha
No ratings yet
Bikesh Shrestha
5 pages
Name: Himanshu Bhatt Course:MCA Subject:Full Stack Development Problem 1: Create A Static Webpage Using Table Tags of HTML
No ratings yet
Name: Himanshu Bhatt Course:MCA Subject:Full Stack Development Problem 1: Create A Static Webpage Using Table Tags of HTML
40 pages
HTML Assignment
No ratings yet
HTML Assignment
31 pages
Experiment 6-10
No ratings yet
Experiment 6-10
18 pages
19BCS4016 Msailabmst-Group4
No ratings yet
19BCS4016 Msailabmst-Group4
8 pages
HTML Form Design & JS Validation
No ratings yet
HTML Form Design & JS Validation
43 pages
Source Codes of Examples Practiced in Class
No ratings yet
Source Codes of Examples Practiced in Class
21 pages
Program No2
No ratings yet
Program No2
10 pages
Exwt 3
No ratings yet
Exwt 3
3 pages
Practical - 7: Aim: (A)
No ratings yet
Practical - 7: Aim: (A)
10 pages
Web Technologies Assessment 2
75% (4)
Web Technologies Assessment 2
26 pages
FSD Module 9
No ratings yet
FSD Module 9
8 pages
Tutorial J9
No ratings yet
Tutorial J9
8 pages
Web Essential Lab
No ratings yet
Web Essential Lab
39 pages
Name: B K Anirudh REG - NO: 19BIT0348: Digital Assignment 2 Web Technologies
No ratings yet
Name: B K Anirudh REG - NO: 19BIT0348: Digital Assignment 2 Web Technologies
49 pages
Web Lab
No ratings yet
Web Lab
33 pages
CSS PR7 Writeup
No ratings yet
CSS PR7 Writeup
11 pages
JavaScript Form and Validation Examples
No ratings yet
JavaScript Form and Validation Examples
25 pages
Javascript Solutions
100% (2)
Javascript Solutions
6 pages
Lab 4
No ratings yet
Lab 4
40 pages
Student Registration Form Guide
No ratings yet
Student Registration Form Guide
7 pages
Web Programming Sample Examples
No ratings yet
Web Programming Sample Examples
94 pages
JKLMN
No ratings yet
JKLMN
17 pages
Web Tech-4
No ratings yet
Web Tech-4
6 pages
Form Validations Code
No ratings yet
Form Validations Code
4 pages
K224818 We Lab 4
No ratings yet
K224818 We Lab 4
15 pages
12 IP Webbrowser8
No ratings yet
12 IP Webbrowser8
3 pages
Mata2664 20
No ratings yet
Mata2664 20
11 pages
R5107G Series: AEC-Q100 Compliant
No ratings yet
R5107G Series: AEC-Q100 Compliant
24 pages
PSIM SPICE Module Tutorial
No ratings yet
PSIM SPICE Module Tutorial
8 pages
ESA Pro P&ID User Manual PDF
No ratings yet
ESA Pro P&ID User Manual PDF
98 pages
ANSYS Rigid Dynamics Guide
No ratings yet
ANSYS Rigid Dynamics Guide
2 pages
MCQ HNS L4-1
No ratings yet
MCQ HNS L4-1
9 pages
Ued Assesment
No ratings yet
Ued Assesment
14 pages
ECT352 - Ktu Qbank
No ratings yet
ECT352 - Ktu Qbank
7 pages
SystemManager 5.27 ReleaseNotes
No ratings yet
SystemManager 5.27 ReleaseNotes
17 pages
Color Picker - HTML Color Codes 2
No ratings yet
Color Picker - HTML Color Codes 2
1 page
Ultrasound - Versana Active Brochure
No ratings yet
Ultrasound - Versana Active Brochure
5 pages
Pit Viper 351
100% (2)
Pit Viper 351
6 pages
Layer 3 Signaling Procedures: By: Hamid Khurshid
No ratings yet
Layer 3 Signaling Procedures: By: Hamid Khurshid
64 pages
Network Topology Seminar Guide
No ratings yet
Network Topology Seminar Guide
30 pages
Learner's Module: Maribel B. Bandojo
100% (10)
Learner's Module: Maribel B. Bandojo
24 pages
Empowerment Technology Power Point
No ratings yet
Empowerment Technology Power Point
69 pages
NEC SV8100 Installation Manual - Programming Manual
100% (1)
NEC SV8100 Installation Manual - Programming Manual
812 pages
Metagpt
No ratings yet
Metagpt
29 pages
Detection of DOM-Based XSS Attack On Web Application
No ratings yet
Detection of DOM-Based XSS Attack On Web Application
9 pages
Unit 2, Social and Preventive Pharmacy, B Pharmacy 8th Sem, Carewell Pharma
No ratings yet
Unit 2, Social and Preventive Pharmacy, B Pharmacy 8th Sem, Carewell Pharma
33 pages
English Exam Practice Guide
No ratings yet
English Exam Practice Guide
20 pages
UP LT Grade Computer 2018 (English)
No ratings yet
UP LT Grade Computer 2018 (English)
24 pages
Advance Java Unit 4 Networking Basics Prof Akhil Jaiswal Notes - No
No ratings yet
Advance Java Unit 4 Networking Basics Prof Akhil Jaiswal Notes - No
21 pages
The Teacher's Guide To Quizlet
No ratings yet
The Teacher's Guide To Quizlet
15 pages
Network Topologies - Worksheet
No ratings yet
Network Topologies - Worksheet
6 pages
Digital Radiography Market Guide
No ratings yet
Digital Radiography Market Guide
84 pages
Practice Test 3
No ratings yet
Practice Test 3
8 pages
Mobile Forensic Investigations: A Guide To Evidence Collection, Analysis, and Presentation, Second Edition Reiber
100% (2)
Mobile Forensic Investigations: A Guide To Evidence Collection, Analysis, and Presentation, Second Edition Reiber
62 pages
Module 5
No ratings yet
Module 5
15 pages

Dept HTML

Uploaded by

Dept HTML

Uploaded by

Dept.

2. Password (Password should not be less than 6 characters length).

4. Mobile Number (Phone number should contain 10 digits only).

5. Last Name and Address (should not be Empty).

AIM: To validate the fields of registration page using JavaScript

can react to user events.

PROGRAM: After clicking OK button the page is redirected to success.html

<head><title>Registration Form Validation</title></head>

// Make quick references to our fields

var firstname = document.getElementById('firstname');

var lastname = document.getElementById('lastname');

var email = document.getElementById('email');

var pass = document.getElementById('pass');

var addr = document.getElementById('addr');

var mobileno = document.getElementById('mobileno');

// Check each input in the order that it appears in the form!

if(notEmpty(firstname, "can not be null")){

if(isAlphabet(firstname, "Please enter only letters for your Firstname")){

if(isAlphabet(lastname, "Please enter only letters for your Lastname")){

if(emailValidator(email, "Please enter a valid email address")){

if(isAlphanumeric(pass, "please enter Numbers and Letters Only for password")){

if(notEmpty(addr, "please enter the address")){

if(isNumeric(mobileno, "Please enter a valid mobileno")){

function notEmpty(elem, helperMsg){

elem.focus(); // set the focus to this input

function isNumeric(elem, helperMsg){

var numericExpression = /^[0-9]+$/;

function isAlphabet(elem, helperMsg){

var alphaExp = /^[a-zA-Z]+$/;

function isAlphanumeric(elem, helperMsg){

var alphaExp = /^[0-9a-zA-Z]+$/;

function lengthRestriction(elem, min){

var uInput = elem.value;

if(uInput.length >= min){

alert("Please enter minimum " +min+ " characters");

function emailValidator(elem, helperMsg)

var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;

function lengthRestriction1(elem, min, max)

var uInput = elem.value;

if(uInput.length >= min && uInput.length <= max)

alert("Please enter 10 numbers only");

<center><font color="blue" size="6" face="arial">Registration Form</font></center><br />

<form onsubmit='return formValidator()' action="right.html">

First Name(Minimum 6 characters)<font color="red">* </font>

<input type='text' id='firstname' /><br /><br />

Last Name<font color="red"><font color="red">* </font> </font> &nbsp;&nbsp;&nbsp;

<input type='text' id='lastname' /><br /><br />

Email Address<font color="red">* </font> &nbsp;&nbsp;&nbsp;

<input type='text' id='email' /><br />

<font color="red">(one e-mail id only):</font> &nbsp;&nbsp;&nbsp;

<font color="redblue">e.g. [email protected]</font><br /><br/>

Password(minimum 6 characters)<font color="red">* </font> &nbsp;&nbsp;&nbsp;

<input type='password' id='pass'><br /><br/>

Address<font color="red">* </font> &nbsp;&nbsp;&nbsp;

<textarea rows="2" cols="20" id='addr' /></textarea> <br /> <br/>

<input type='text' id='mobileno' /><br />

Gender: <input type='radio' name="gender">male

<input type='radio' name="gender">female<br/><br />

<input type='Submit' value='submit' />

<input type='Reset' value='reset' />

sheet using CSS.

1) Use different font styles

2) Control the repetition of image with background-repeat and no-repeat property

3) Define style for links as a: link, a: active, a: hover, a: visited

4) Add customized cursors for links.

<link rel="stylesheet" type="text/css" href="style.css">

<h1 style="color:blue;text-align:center;"> CSS (Inline, Internal and External) </h1>

<p>This Paragraph is a Not Styled</p>

<p class="left">This Paragraph is Styled by class "Left"</p>

<p class="center">This Paragraph is Styled by class "Center"</p>

<p class="right">This Paragraph is Styled by class "Right"</p>

<b>This is normal Bold</b> <br>

<b id="headline">This Bold Text is Styled </b>

<h2><b><a href=" ">This is a link</a></b></h2>

<h3 class="c2">The cursor over this element is a pointing hand</h3>

<h3 class="c3">The cursor over this element is a grasping hand</h3>

Last Name<font color="red"><font color="red">* </font> </font>

Email Address<font color="red">* </font>

<font color="red">(one e-mail id only):</font>

Password(minimum 6 characters)<font color="red">* </font>

Address<font color="red">* </font>