WEB TECHNOLOGYS

WEB TECHNOLOGIES
LABORATORY MANUAL
B.TECH
(III YEAR – II SEM)
(2021-2022)
DEPARTMENT OF COMPUTER SCIENCE AND

ENGINEERING
MALLA REDDY COLLEGE OF ENGINEERING &

TECHNOLOGY
(Autonomous Institution – UGC, Govt. of India)
Recognized under 2(f) and 12 (B) of UGC ACT 1956
(Affiliated to JNTUH, Hyderabad, Approved by AICTE - Accredited by NBA & NAAC – ‘A’ Grade - ISO 9001:2015 Certified)
Maisammaguda, Dhulapally (Post Via. Hakimpet), Secunderabad – 500100, Telangana State, India
DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
Vision
 To acknowledge quality education and instill high patterns of
discipline making the students technologically superior and ethically
strong which involves the improvement in the quality of life in
human race.
Mission
 To achieve and impart holistic technical education using the best of
infrastructure, outstanding technical and teaching expertise to
establish the students into competent and confident engineers.
 Evolving the center of excellence through creative and innovative
teaching learning practices for promoting academic achievement to
produce internationally accepted competitive and world class
professionals.
PROGRAMME EDUCATIONAL OBJECTIVES (PEOs)
PEO1 – ANALYTICAL SKILLS
1. To facilitate the graduates with the ability to visualize, gather information,

articulate, analyze, solve complex problems, and make decisions. These are
essential to address the challenges of complex and computation intensive
problems increasing their productivity.
PEO2 – TECHNICAL SKILLS
2. To facilitate the graduates with the technical skills that prepare them for
immediate employment and pursue certification providing a deeper
understanding of the technology in advanced areas of computer science and
related fields, thus encouraging to pursue higher education and research based
on their interest.
PEO3 – SOFT SKILLS
3. To facilitate the graduates with the soft skills that include fulfilling the mission,
setting goals, showing self-confidence by communicating effectively, having a
positive attitude, get involved in team-work, being a leader, managing their
career and their life.
PEO4 – PROFESSIONAL ETHICS
To facilitate the graduates with the knowledge of professional and ethical

responsibilities by paying attention to grooming, being conservative with style,
following dress codes, safety codes,and adapting themselves to technological
advancements.
PROGRAM SPECIFIC OUTCOMES (PSOs)
After the completion of the course, B. Tech Computer Science and Engineering, the
graduates will have the following Program Specific Outcomes:
1. Fundamentals and critical knowledge of the Computer System:- Able to

Understand the working principles of the computer System and its components ,
Apply the knowledge to build, asses, and analyze the software and hardware
aspects of it .
2. The comprehensive and Applicative knowledge of Software Development:

Comprehensive skills of Programming Languages, Software process models,
methodologies, and able to plan, develop, test, analyze, and manage the
software and hardware intensive systems in heterogeneous platforms
individually or working in teams.
3. Applications of Computing Domain & Research: Able to use the professional,

managerial, interdisciplinary skill set, and domain specific tools in development
processes, identify the research gaps, and provide innovative solutions to them.
PROGRAM OUTCOMES (POs)
Engineering Graduates will be able to:
1. Engineering knowledge: Apply the knowledge of mathematics, science,
engineering fundamentals, and an engineering specialization to the solution
of complex engineering problems.
2. Problem analysis: Identify, formulate, review research literature, and analyze

complex engineering problems reaching substantiated conclusions using first
principles of mathematics, natural sciences, and engineering sciences.
3. Design / development of solutions: Design solutions for complex engineering
problems and design system components or processes that meet the
specified needs with appropriate consideration for the public health and
safety, and the cultural, societal, and environmental considerations.
4. Conduct investigations of complex problems: Use research-based knowledge
and research methods including design of experiments, analysis and
interpretation of data, and synthesis of the information to provide valid
conclusions.
5. Modern tool usage: Create, select, and apply appropriate techniques,
resources, and modern engineering and IT tools including prediction and
modeling to complex engineering activities with an understanding of the
limitations.
6. The engineer and society: Apply reasoning informed by the contextual
knowledge to assess societal, health, safety, legal and cultural issues and the
consequent responsibilities relevant to the professional engineering practice.
7. Environment and sustainability: Understand the impact of the professional
engineering solutions in societal and environmental contexts, and
demonstrate the knowledge of, and need for sustainable development.
8. Ethics: Apply ethical principles and commit to professional ethics and
responsibilities and norms of the engineering practice.
9. Individual and team work: Function effectively as an individual, and as a
member or leader in diverse teams, and in multidisciplinary settings.
10. Communication: Communicate effectively on complex engineering activities
with the engineering community and with society at large, such as, being able
to comprehend and write effective reports and design documentation, make
effective presentations, and give and receive clear instructions.
11. Project management and finance: Demonstrate knowledge and
understanding of the engineering and management principles and apply
these to one’s own work, as a member and leader in a team, to manage
projects and in multi disciplinary environments.
12. Life- long learning: Recognize the need for, and have the preparation and
ability to engage in independent and life-long learning in the broadest
context of technological change.
MALLA REDDY COLLEGE OF ENGINEERING & TECHNOLOGY
Maisammaguda, Dhulapally Post, Via Hakimpet, Secunderabad – 500100
DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
GENERAL LABORATORY INSTRUCTIONS
1. Students are advised to come to the laboratory at least 5 minutes before (to the
starting time), those who come after 5 minutes will not be allowed into the lab.
2. Plan your task properly much before to the commencement, come prepared to the
lab with the synopsis / program / experiment details.
3. Student should enter into the laboratory with:
a. Laboratory observation notes with all the details (Problem statement, Aim,
Algorithm, Procedure, Program, Expected Output, etc.,) filled in for the lab session.
b. Laboratory Record updated up to the last session experiments and other utensils (if
any) needed in the lab.
c. Proper Dress code and Identity card.
4. Sign in the laboratory login register, write the TIME-IN, and occupy the computer
system allotted to you by the faculty.
5. Execute your task in the laboratory, and record the results / output in the lab
observation note book, and get certified by the concerned faculty.
6. All the students should be polite and cooperative with the laboratory staff, must
maintain the discipline and decency in the laboratory.
7. Computer labs are established with sophisticated and high end branded systems,
which should be utilized properly.
8. Students / Faculty must keep their mobile phones in SWITCHED OFF mode during
the lab sessions.Misuse of the equipment, misbehaviors with the staff and systems
etc., will attract severe punishment.
9. Students must take the permission of the faculty in case of any urgency to go out ; if
anybody found loitering outside the lab / class without permission during working
hours will be treated seriously and punished appropriately.
10. Students should LOG OFF/ SHUT DOWN the computer system before he/she leaves
the lab after completing the task (experiment) in all aspects. He/she must ensure
the system / seat is kept properly.
Head of the Department Principal

Objectives:
 To develop an ability to design and implement static and dynamic website

 Choose best technologies for solving web client/server problems
 Create conforming web pages
 Use JavaScript for dynamic effects
 To prepare PHP scripts
 Use JavaScript & PHP to validate form input entry
 Understand, analyze and create XML documents and XML Schema
 Understand, analyze and build web applications using PHP
 Use appropriate client-side or Server-side applications
 Handling Cookies and Sessions using PHP, SERVLETS and JSP
 Manage normal and abnormal interactions with databases using JDBC.
Outcomes:
Upon successful completion of this course, the students will be able to:
 Design and implement dynamic websites with good aesthetic

sense of designingand latest technical know-how's
 Create web pages using HTML and Cascading Styles sheets
 Analyze a web page and identify its elements and attributes
 Create dynamic web pages using JavaScript
 Build web applications using PHP
 Create XML documents and XML Schema
 Understand, analyze and apply the role of languages like HTML,
CSS, XML, JavaScript, PHP, SERVLETS, JSP and protocols in the
workings of the web and web applications
 Have a Good grounding of Web Application Terminologies, Internet Tools,
E – Commerce and other web services
 Develop interactive web applications using HTML forms and servlets.
 Use request and response objects provided to a servlet to read
parameters andto produce an HTML response.
 Develop JSP applications implementing Session management and
Data baseConnectivity.
INDEX
S.No List of programs Pg.No.

Design the following static web pages required for an online book storeweb site.
1 1-9
1) HOME PAGE: The static home page must contain three frames.
2) LOGIN PAGE
3) CATOLOGUE PAGE: The catalogue page should contain thedetails of all the
books available in the web site in a table.
4) REGISTRATION PAGE
Develop and demonstrate the usage of inline, internal and externalstyle sheet
2 using CSS 10-13
Write JavaScript to validate the following fields of the Registrationpage.
3 14-19
1. First Name (Name should contains alphabets and the lengthshould 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).
Last Name and Address (should not be Empty).
Develop and demonstrate JavaScript with POP-UP boxes andfunctions for the
4 following problems: 20-21
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
a) Input: A number n obtained using prompt
5 Output: A multiplication table of numbers from 1 to 10 of n using 22-23
alert
b) Input: A number n obtained using prompt and add another numberusing

confirm
Output: Sum of the entire n numbers using alert
Write an HTML page that contains a selection box with a list of 5 countries. When 24
6 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).
Write an XML file which will display the book information which includes the 25-29
7 following:
1) Title of the book
2) Author name
3) ISBN number
4) Publisher name
5) Edition
6) Price
Write a DTD to validate the above xml file. Display the XML file as follows.
The contents should be displayed in a table. The header of the table should be in
color GREY. And the Author names column should be displayed in one color and
should be capitalized and in bold. Use your own colors for remaining columns. Use
XML schemas XSL and CSS for the above purpose.
8 Develop and demonstrate PHP Script for the following problems: 30-32
a) Write a PHP Program to display current Date, Time and Day.
b) Write a PHP Script to check whether the given number is palindrome or not.
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
withthe entered name. Otherwise it should send “Welcome <name> to
this site” message.
9 Implement the following web applications using Servlets 33-39
i) 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).
ii) Write a PHP Program to display current Date, Time and Day.
iii) 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 withthe entered name. Otherwise it should send “Welcome
<name> to this site” message.
iv) A web application that lists all cookies stored in the browser on
clicking“List Cookies” button. Add cookies if necessary.
10 40-44
Implement the web applications with Database using
(a) PHP, (b) Servlets
11 Implement the following web applications using JSP 45-49

i) Write a PHP Program to display current Date, Time and Day.
ii) 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 withthe entered name. Otherwise it should send “Welcome
<name> to this site”message.
iii) Write a program for deploying Java Beans in a JSP page.
12 50-57
Write a program to design a simple calculator using (a) JavaScript (b)PHP (c)
Servlet and (d) JSP.
‘
WEB TECHNOLOGIES LAB MRCET
WEEK 1:
Design the following static web pages required for an online book store web site.
1) HOME PAGE: The static home page must contain three frames.
2) LOGIN PAGE
3) CATOLOGUE PAGE: The catalogue page should contain the details of all the
booksavailable in the web site in a table.
4) REGISTRATION PAGE
Aim: Design the following static web pages required for online book store.
1. Home page:- the static home page must contains three pages
2. Top frame:- logo and college name and links to homepage, login page, registration
pageand catalogue page
3. Left frame:- at least four links for navigation which will display the catalogue of
Respective links
4. Right frame:- the pages to links in the left frame must be loaded here initially it
Containsthe description of the website.
DESCRIPTION: In this program the entire web paged are created by using basic
HTML tags. Home page is divided into 3 frames by using <frameset> and <frame>
tags. A frame isused to display a web page within a web page.
<frameset>:
 The <frameset> tag defines a frameset.
 The <frameset> element holds one or more <frame> elements.
 Each <frame> element can hold a separate document.
 The <frameset> element specifies HOW MANY columns or rows there will be
in the frameset, and HOW MUCH percentage/pixels of space will occupy each of
them.
<frame>:
 The <frame> tag defines one particular window (frame) within a <frameset>.
 Each <frame> in a <frameset> can have different attributes, such as border,
scrolling, the ability to resize, etc.
PROGRAM:
home.html:
<frameset rows="40%,*">
<frame src="top.html" noresize scrolling="NO" name="topframe">
<frameset cols="15%,*">
<frame src="left.html" noresize scrolling="NO" name="leftframe">
<frame src="right.html" noresize name="rightframe" scrolling="auto">
</frameset>
</frameset>
top.html:
<html>
<head>
<title>Top Frame</title>
</head>
<body bgcolor="YellowGreen ">
DEPARTMENT OF CSE 1
<img src="images/logo1.png" width="125" height="115" align="left">

<img src="images/cse.png" width="125" height="115" align="right">
<center>
<marquee bgcolor="yellow" width="650" behavior="alternate">
<font face="Brush Script MT" size="8" color="green"><b><i>Online Book Store</i></b>
</font>
</marquee> <br>
<font face="Brush Script" size="6" color="white"><b>Created & Maintained ByMRCET</b></font
</center>
<br>
<table width="100%" height="50%" cellspacing=10>
<tr align="center">
<td> <a href="Home.html" target="_parent"><font face="Brush Script"
size="6"color="navy">HOME </a> </td>
<td> <a href="login.html" target="rightframe"><font face="Brush Script" size="6"
color="navy">LOGIN</a> </td>
<td> <a href="registration.html" target="rightframe"> <font face="Brush
Script"size="6" color="navy">REGISTER </a> </td>
<td> <a href="catalogue.html" target="rightframe"> <font face="Brush
Script"size="6" color="navy">CATALOGUE</a> </td>
</tr>
</table>
</body>
</html>
left.html:
<html>
<body align="center" bgcolor="bisque"> <br>
<a href="cse.html" target="rightframe"><font size="6">CSE</font></a><br><br>
<a href="ece.html" target="rightframe"><font size="6">ECE</font></a><br><br>
<a href="eee.html" target="rightframe"><font size="6">EEE</font></a><br><br>
<a href="mech.html" target="rightframe"><font size="6">MECH</font></a><br>
</body>
</html>
right.html:
<html>
<body bgcolor="orange">
<center>
<img src="images/Books.jpg" height="170"><br>
<font face="Brush Script MT" size="5" color="blue">
<h1><b>Welcome to the Online Book Store!!!</b></font><br />
<font face="Brush Script MT" size="5" color="red">
<h2><b> "A Huge Collection Of Engineering E-Books"</b></h2></font>
</center>
</body>
</html>
DEPARTMENT OF CSE 2
cse.html:
<html>
<head><title>CSE</title></head>
<body bgcolor="cyan">
<center><font color="blue"><h1>Computer Science and Engineering</h1></font></center>
<br>
<table align="center">
<tr>
<td>Text Books</td>
<td>
<select >
<option value="select the book" selected>Select the book
<option value="C&Ds">C&Ds
<option value="Ads">Ads
<option value="Java">Java
<option value="Oracle">Oracle
<option value="Ms SQL Server">Ms SQL Server
<option value="MySql">MySql
</select>
</td></tr>
<tr>
<td>Quantity</td>
<td><input type="text" id="q"></td>
</tr>
<tr>
<td></td>
<td>
<form method=post action="order.html">
<input type="submit" value=ok />
</form>
</td>
</tr>
</table>
<center>
<pre> Cost of one book is"500" + shipping "100" </pre>
</center>
</body>
</html>
ece.html:
<html>
<body bgcolor="Plum">
<h1><font color="blue">Electronics and Communication Engineering</font></h1>
<h2>
<ul>
<li>Digital Circuits</li> <li>Signals and Systems</li> <li>Digital Communication</li>
</ul>
</h2>
</body>
</html>
DEPARTMENT OF CSE 3
eee.html:
<html>
<h1><font color="blue">Electrical and Electronics Engineering</font></h1>
<h2>
<ul type="square">
<li>Concepts in Electric Circuits</li>
<li>Introduction to Electronic Engineering</li>
<li>Electrical Power</li>
</ul>
</h2>
</body>
</html>
mech.html:
<html>
<h1><font color="blue">Electronics and Communication Engineering</font></h1>
<h2>
<ol type="I">
<li>Theory of Machines</li>
<li>Automation and Robotics</li>
<li>Engineering Fluid Mechanics</li>
</ol>
</h2>
</body>
</html>
catalogue.html:
<html>
<head>
<title> Catalogue </title>
</head>
<body bgcolor="pink">
<form action="order.html">
<table border="1" width="100%">
<tr>
<td>
<img src="images/wt.jpg" width=100 height=100/>
</td>
<td> Book: Web Technologies <br> Author: Uttam K. Roy <br>
Publication:OxfordUniversity Press</td> <td>531
   </td>
<td> <input type="submit" value="Add to cart"/></td> </tr>
<tr>
<td> <img src="images/php.jpg" width=100 height=100/></td>
<td> Book: PHP & MySQL Web Development <br> Author:Luke Welling &
Laura Thompson <br> Publication:PEARSON</td> <td> 898
    </td>
<td> <input type="submit" value="Add to cart"/></td> </tr>
DEPARTMENT OF CSE 4
</table> </form>
</body> </html>
login.html:
<html>
<body bg color="pink">
<basefont face="Cambria" size="4"> <br>
<center>
<img src="images/login.jpg" width="385" height="135" /><br />
<font face="Brush Script MT" size="7" color="purple">
<b>Enter Login Details:</b>
</font>
</center>
<form name="f1" method="post" action="right.html">
<table align="center" width="100" height="150" cellspacing=”15”>
<tr><td><b>Login ID:</b></td>
<td><input type="text" name="t1"></td>
</tr>
<tr>
<td><b>Password:</b></td>
<td><input type="password" name="t2"></td>
</tr>
<tr align="center">
<td><input type="submit" name="b1" value="Submit"></td>
<td><input type="reset" name="b2" value="Reset"></td>
</tr>
</table> </form> </basefont> </body> </html>
registration.html:
<html>
<head><title>Registration Form</title></head>
<body bgcolor="#E4F0F8">
<center><font color="blue" size="6" face="arial">Registration Form</font></center><br />
<form 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 />
EmailAddress<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>
DEPARTMENT OF CSE 5

<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>
order.html:
<html>
<head><title>order conformation</title></head>
<center>
<pre><strong>
<b>Your order Is Conformed
</strong></pre>
<h2><b>THANK YOU...Visit Again</h2>
</center>
</body>
</html>
OUTPUT:
DEPARTMENT OF CSE 6
DEPARTMENT OF CSE 7
DEPARTMENT OF CSE 8
DEPARTMENT OF CSE 9
WEEK - 2: 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;
DEPARTMENT OF CSE 10
}
b#headline
{
color:orange;
font-
size:22px;
font-
family:arial;
text-decoration:underline;
}
sample.html
<html>
<head>
<style
type="text/css">
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 1:
OUTPUT 2: background-repeat : repeat;
WEEK 3: 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 6characters).
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 codecan react to user events.
PROGRAM: After clicking OK button the page is redirected to success.html
<html>
<head><title>Registration Form Validation</title></head>
<body bgcolor="#E4F0F8">
<script
type='text/javascript'>
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>
OUTPUT:
WEEK - 4: Develop and demonstrate JavaScript with POP-UP boxes and functions
forthe following problems:
a) Input: Click on Display Date button using onclick( )
functionOutput: 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
alertPROGRAM:
a) date.html
<html>
<body>
<script>
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>
<script language='javascript'> function factorialcalc()
{
number = parseint(prompt("enter a number, i'll calculate its factorial",
"wholenumbers bigger than zero, please"))
factorial = 1
for (i=1; i <= number; i++)
{
factorial = factorial * i
}
alert("the factorial of " + number + " is " + factorial)
}
</script>
</head>
<body><form name=frm>
<input type=button value='factorial' onclick="factorialcalc();">
</form>
</body>
</html>
OUTPUT:
WEEK - 5:
a) Input: A number n obtained using prompt
Output: A multiplication table of numbers from 1 to 10 of n using alert
b) Input: A number n obtained using prompt and add another numberusing confirm
Output: Sum of the entire n numbers using alert
PROGRAM:
A) multable.html
<html>
<head><title> Multiplication Table </title></head>
<body>
<script type="text/javascript">

</script>
</body>
</html>
OUTPUT:
B) sum of n numbers.html
<html>
<head><title>sum of n numbers using popup boxes</title>
<script
language='javascript'>
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>
<form name=frm>
<input type=button value='sum of n numbers' onclick="addsum();">
</form>
</body>
</html>
OUTPUT:
WEEK - 6:
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>
h1{
color: red;
text-align: center;
}
.textbox1
{
color: blue;
font-size:
30px;
font-weight: bold; }
</style>
<body>
<center>
<h1> Select the country name to find its capital</h1>
<form name="myform">
Select Country <select name="country" id="sbox1" onClick="myFunction()" required>
<option value=""></option>
<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>
<script>
function myFunction()
{ var a=document.getElementById("sbox1").value;
document.getElementById("sbox2").value=a; }
</script> </body> </html>
OUTPUT:
WEEK - 7:
Write an XML file which will display the book information which includes the following:
1) Title of the book
2) Author name
3) ISBN number
4) Publisher name
5) Edition
6) Price
Write a DTD to validate the above xml file. Display the XML file as follows
The contents should be displayed in a table. The header of the table should be in color GREY.
And the Author names column should be displayed in one color and should be capitalized and in
bold. Use your own colors for remaining columns. Use XML schemas XSL and CSS for the above
purpose
PROGRAM:
XML document (bookstore.xml)
<bookstore>
<book>
<title>web programming</title>
<author>chrisbates</author>
<ISBN>123-456-789</ISBN>
<publisher>wiley</publisher>
<edition>3</edition>
<price>350</price>
</book>
<book>
<title>internet worldwideweb</title>
<author>ditel&ditel</author>
<ISBN>123-456-781</ISBN>
<publisher>person</publisher>
<price>450</price>
</book>
</bookstore>
XML document Validation using DTD

DTD document (bookstore.dtd)
<?xml version="1.0" encoding="UTF-8"?>

<!ELEMENT bookstore (book+)>
<!ELEMENT book (title,author,ISBN,publisher,edition,price)>
<!ELEMENT title (#PCDATA)>
<!ELEMENT author (#PCDATA)>
<!ELEMENT ISBN (#PCDATA)>
<!ELEMENT publisher (#PCDATA)>
<!ELEMENT edition (#PCDATA)>

<!ELEMENT price (#PCDATA)>
Bookstore.xml
<!DOCTYPE bookstore SYSTEM "C:\Documents and Settings\Administrator\My
Documents\bookstore.dtd">
<bookstore>
<book>
<ISBN>123-456-789</ISBN>
<price>350</price>
</book>
<book>
<ISBN>123-456-781</ISBN>
<price>450</price>
</book>
</bookstore>
XML document Validation using DTD

XML Schema (bookstore.xsd)

<xs:schema elementFormDefault="qualified" attributeFormDefault="unqualified"
xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="bookstore">
<xs:complexType>
<xs:sequence>
<xs:element name="book" maxOccurs="unbounded">
<xs:complexType>
<xs:sequence>
<xs:element name="title" type="xs:string"></xs:element>
<xs:element name="author" type="xs:string"></xs:element>
<xs:element name="ISBN" type="xs:string"></xs:element>
<xs:element name="publisher" type="xs:string"></xs:element>
<xs:element name="edition" type="xs:int"></xs:element>
<xs:element name="price" type="xs:decimal"></xs:element>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>
Bookstore.xml
<bookstore xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="C:\Documents and Settings\Administrator\My
Documents\bookstore.xsd">
<book>
<ISBN>123-456-789</ISBN>
<price>350</price>
</book>
<book>
<ISBN>123-456-781</ISBN>
<price>450</price>
</book>
</bookstore>
· Display the XML file as follows.
PROGRAM:
XML:
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="bookstore.xsl"?>
<bookstore>
<book>
<title>Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book>
<title>Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
</book>
<book>
<title>Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
</book>
</bookstore>
XSL:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2> My Books collection</h2>
<table border="1">
<tr bgcolor="red">
<th align="left">title</th>
<th align="left">author</th>
</tr>
<xsl:for-each select="bookstore/book">
<tr>
<td><xsl:value-of select="title"/></td>
<xsl:choose>
<xsl:when test="price > 30">
<td bgcolor="yellow"><xsl:value-of select="author"/></td>
</xsl:when>
<xsl:when test="price > 10">
<td bgcolor="magneta"><xsl:value-of select="author"/></td>
</xsl:when>
<xsl:otherwise>
<td><xsl:value-of select="author"/></td>
</xsl:otherwise>
</xsl:choose>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
OUTPUT:
WEEK - 8:
Develop and demonstrate PHP Script for the following problems:
b) Write a PHP Script to check whether the given number is palindrome or not.
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 withthe entered name. Otherwise it should send
“Welcome <name> to this site” message
Program:
<?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:
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:
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.
checkage.html
<html>
<body bgcolor="bisque">
<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>
<input type='submit'value='Login'>
</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:
WEEK - 9:
Implement the following web applications using Servlets
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).
b) Write a PHP Program to display current Date, Time and Day.
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.
Program: a)
Session1.html
<html>
<head> <title> SESSION LOGIN </title> </head>
<body>
<center>
<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/ht
ml");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
import java.io.*;
import java.util.*;
public class Session2 extends HttpServlet
{
public void doGet(HttpServletRequest req, HttpServletResponse res) throws
{
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
<web-app>
<servlet>
<servlet-name>session1</servlet-name>
<servlet-class>Session1</servlet-class>
</servlet>
<servlet-mapping>
<url-pattern>/session6vib</url-pattern>
</servlet-mapping>
<servlet>
<servlet-class>Session2</servlet-class>
</servlet>
<servlet-mapping>
<url-pattern>/session26vib</url-pattern>
</servlet-mapping>
</web-app>
Output:
b)
DateSrv.java
import java.io.*;
import
javax.servlet.*;
public class DateSrv extends GenericServlet
{
//implement service()
public void service(ServletRequest req, ServletResponse res) throws
{
//set response content type
ml");
//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
<web-app>
<servlet>
<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:
c)
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>
<tr><td></td>
<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)
throwsIOException,ServletException
{
//set response content type
ml");
//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 to visit 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>
<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:
WEEK - 10:
Execute simple queries with Database using a) PHP, b) Servlets
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
connectionif
(!$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
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.getMessag
e());
}
out.println("</body></html>");
}
}
web.xml:
<web-app>
<servlet>
<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:
WEEK - 11:
Implement the following web applications using JSP
i) Write a PHP Program to display current Date, Time and Day.
ii) 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 withthe entered name. Otherwise it should
send “Welcome <name> to this site”message.
iii) Write a program for deploying Java Beans in a JSP page.
Program
i) 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:
ii) UserEligibility.html:
<html>
<head> <title> User Acess </title> </head>
<body> <br>
<center>
<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>");
}
%>
Output:
iii). SampleBean.java
package com.javacodegeeks.snippets.enterprise;
import java.util.Date;
public class SampleBean {
private String param1;

private Date param2 = new Date();
public String getParam1() {

return param1;
}
public void setParam1(String param1) {
this.param1 = param1;
}
public Date getParam2() {

return param2;
}
public void setParam2(Date param2) {
this.param2 = param2;
}
@Override
public String toString() {
return "SampleBean [param1=" + param1 + ", param2=" + param2 + "]";
}
UseBean.jsp
<%@ page language="java" contentType="text/html;charset=UTF-8" %>

<%@ page import="com.javacodegeeks.snippets.enterprise.SampleBean"%>
<html>
<head>
<title>Java Code Geeks Snippets - Use a Bean in JSP Page</title>
</head>
<body>
<jsp:useBean id="sampleBean" class="com.javacodegeeks.snippets.enterprise.SampleBean"

scope="session">
<%-- intialize bean properties --%>
<jsp:setProperty name="sampleBean" property="param1" value="value1" />
</jsp:useBean>
Sample Bean: <%= sampleBean %>
param1: <jsp:getProperty name="sampleBean" property="param1" />

param2: <jsp:getProperty name="sampleBean" property="param2" />
</body>
URL:
http://myhost:8080/jcgsnippets/UseBean.jsp
Output:
Sample Bean: SampleBean [param1=value1, param2=Thu Nov 17 21:28:03 EET 2011]
param1: value1 param2: Thu Nov 17 21:28:03 EET 2011
WEEK - 12:
Write a program to design a simple calculator using (a) JavaScript (b)PHP (c) Servlet and (d) JSP
(a) USING JavaScript

PROGRAM:
cal.html
<html>
<head>
<title>Calculator</title>
<script
language="javascript"> var
inputstring="";
function updatestring(value)
{
inputstring=inputstring+value;
document.calculator.input.value=inputstring;
}
</script>
</head>
<body>
<form name="calculator">
<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="/" onclick="updatestring('/')"> </td> </tr>
<tr>
<td><input type="button" value="-" onclick="updatestring('-')"> </td> </tr>
<tr>
<td><input type="button" value="+" onclick="updatestring('+')"> </td> </tr>
<tr>
<td><input type="button" value="." onclick="updatestring('.')"> </td>
<td><input type="button" value="=" onclick="input.value=eval(inputstring);"> </td> </tr>
</table> </form> </body> </html>
OUTPUT:
(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;
}
?>
Output:
(c) USING SERVLETS

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 name="op">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
<option value="%">%</option>
</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 :::"+(n1*n2));}
else if(op.equals("/")){pw.println("Division
:::"+(n1/n2));}else{pw.println("Remainder
:::"+(n1%n2));}
pw.close();
}
}
web.xml
<web-app>
<servlet>
<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

JSP. calculator.html
<html>
<title>calculator</title>
<head><h1><center>Basic Calculator</center></h1></head>
<body>
<center>
<form action="http://localhost:8080/jsp/calculator.jsp" method="get">
<label for="num1"><b>Number 1</b></label>
<input type="text" name ="num1"><br><br>
<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>
<head></head>
<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:

WEB TECHNOLOGYS

Uploaded by

Copyright:

Available Formats

WEB TECHNOLOGYS

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

WEB TECHNOLOGYS

Uploaded by

Copyright:

Available Formats

WEB TECHNOLOGIES

DEPARTMENT OF COMPUTER SCIENCE AND

MALLA REDDY COLLEGE OF ENGINEERING &

PEO1 – ANALYTICAL SKILLS

1. To facilitate the graduates with the ability to visualize, gather information,

PEO2 – TECHNICAL SKILLS

PEO3 – SOFT SKILLS

PEO4 – PROFESSIONAL ETHICS

To facilitate the graduates with the knowledge of professional and ethical

1. Fundamentals and critical knowledge of the Computer System:- Able to

2. The comprehensive and Applicative knowledge of Software Development:

3. Applications of Computing Domain & Research: Able to use the professional,

2. Problem analysis: Identify, formulate, review research literature, and analyze

GENERAL LABORATORY INSTRUCTIONS

Head of the Department Principal

 To develop an ability to design and implement static and dynamic website

 Design and implement dynamic websites with good aesthetic

S.No List of programs Pg.No.

b) Input: A number n obtained using prompt

b) Input: A number n obtained using prompt and add another numberusing

11 Implement the following web applications using JSP 45-49

<img src="images/logo1.png" width="125" height="115" align="left">

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

OUTPUT 2: background-repeat : repeat;

AIM: To validate the fields of registration page using JavaScript

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

XML document Validation using DTD

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

<!ELEMENT edition (#PCDATA)>

XML document Validation using DTD

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

· Display the XML file as follows.

b). Check whether the given number is Palindrome or not

public class SampleBean {

private String param1;

public String getParam1() {

public Date getParam2() {

<%@ page language="java" contentType="text/html;charset=UTF-8" %>

<jsp:useBean id="sampleBean" class="com.javacodegeeks.snippets.enterprise.SampleBean"

Sample Bean: <%= sampleBean %>

param1: <jsp:getProperty name="sampleBean" property="param1" />

param1: value1 param2: Thu Nov 17 21:28:03 EET 2011

(a) USING JavaScript

(b) USING PHP

(c) USING SERVLETS

(d) USING JSP

You might also like