Web Engineering Practical PDF

PRACTICAL
WEB ENINEERING
NAME: IMAD UL HAQ

ROLL NO:: BSF2008897
(BSIT – 5TH SEM)

(2020-2024)
QUESTION::
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;
}
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>
<body bgcolor="cyan">
<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>
------------------------------------------------------------
QUESTION::
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>
<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", "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>
<body><form name=frm>
<input type=button value='factorial' onclick="factorialcalc();">
</form>
</body>
</html>
OUTPUT:
c) multable.html
<html>
<head><title> Multiplication Table </title></head>
<body>
<script type="text/javascript">

</script>
</body>
</html>
OUTPUT:
d) 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:
----------------------------------------------------------------------------------------------------------------
QUESTION::
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:
QUESTION::
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>
<SCRIPT language=Javascript>

</SCRIPT>
<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:
QUESTION::
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
<usersinformation>
<user>
<rollno>501</rollno>
<name>aaa</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<name>bbb</name>
</user>
<user>
<name>ccc</name>
</user>
<user>
<name>ddd</name>
</user>
<user>
<name>eee</name>
</user>
<user>
<name>fff</name>
</user>
<user>
<name>ggg</name>
</user>
<user>
<name>hhh</name>
</user>
<user>
<name>iii</name>
</user>
<user>
<name>jjj</name>
</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:
QUESTION::
). 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>
<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:
SAAAADAD
QUESTION:
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>
<center>
<?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:
QUESTION::
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>
<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/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 java.io.*;
import java.util.*;
public class Session2 extends HttpServlet
{
public void doGet(HttpServletRequest req, HttpServletResponse res) throws IOException,
ServletException
{
try
{
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>
<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:
QUESTION
Write a Servlet application to print the current date and time.
Aim: To print Current date and time using Servlet.
USING SERVLET
DateSrv.java
import java.io.*;
public class DateSrv extends GenericServlet
{
//implement service()
public void service(ServletRequest req, ServletResponse res) throws
IOException, ServletException
{
//set response content type
//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>
<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:
QUESTION::
A web application that takes name and age from an HTML page. If the age is less than
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>
<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.*;
public class VoterSrv extends HttpServlet
{
public void service(HttpServletRequest req, HttpServletResponse res)
throws IOException,ServletException
{
//set response content type
//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:
QUESTION::
). 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.*;
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);
pwriter.print("<br><a href='welcome'>LIST COOKIES</a>");
pwriter.close();
}catch(Exception exp){
System.out.println(exp);
}
}
}
MyServlet2.java
import java.io.*;
public class MyServlet2 extends HttpServlet {
public void doGet(HttpServletRequest request,
HttpServletResponse response){
try{
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
cookie
}
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>
<servlet-name>Servlet1</servlet-name>
<servlet-class>MyServlet1</servlet-class>
</servlet>
<servlet-mapping>
<url-pattern>/login</url-pattern>
</servlet-mapping>
<servlet>
<servlet-class>MyServlet2</servlet-class>
</servlet>
<servlet-mapping>
<url-pattern>/welcome</url-pattern>
</servlet-mapping>
</web-app>
Output:
QUESTION::
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>
<center>
<form action="http://localhost:8080/jsp/Session1.jsp" method="get">
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%>
<br><br>
<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%>
<br><br>
Session duration: <%=(t2-t1)/(60*60)%>
seconds <% session.invalidate();%>
Output:
QUESTION::
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:
QUESTION::
A web application that takes name and age from an HTML page. If the age is less than
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>
<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:
QUESTION::
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
<%
String name=request.getParameter("name1");
Cookie c1=new Cookie ("firstname",name);
c1.setMaxAge(50*50);
%>
<form method="get" action="http://localhost:8080/jsp/cookie2.jsp">
<input type="submit" value="List Cookies"> </form>
cookie2.jsp
<title> List of Cookies </title>
<h1> List of Cookies </h1>
<%
Cookie[] cookies=request.getCookies();
%>
<table border=1>
</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>
Output:
QUESTION
Implement the web applications with Database using
(A) Servlets and (B) JSP.
(A) USING SERVLET

DBExample.java
import java.io.*;
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";
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>");
}
}
web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<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:
(B) 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:
QUESTION::
Write a program to design a simple calculator using (a) JavaScript (b) Servlet and (C)
JSP.
(a) USING JavaScript
AIM: To design a simple calculator 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 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
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:
(C) USING JSP
Aim: To design a calculator using 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 Engineering Practical PDF

Uploaded by

Copyright:

Available Formats

Web Engineering Practical PDF

Uploaded by

Document Information

Original Title

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 Engineering Practical PDF

Uploaded by

Copyright:

Available Formats

PRACTICAL

NAME: IMAD UL HAQ

(BSIT – 5TH SEM)

Capital <input type="text" class="textbox1"

(A) USING SERVLET

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

You might also like