Scribd
Upload
6 views71 pages

WT Lab Manual

Uploaded by

sagarisrk888
Copyright
© © All Rights Reserved
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
6 views71 pages

WT Lab Manual

Uploaded by

sagarisrk888
Copyright
© © All Rights Reserved
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/ 71

LAB MANUAL

WEB TECHNOLOGY

DEPARTMENT OF MCA

SRK INSTITUTE OF TECHNOLOGY

ACADEMIC YEAR 2025-26

(II MCA I Sem SRK23 Regulation)

Prepared By
K. Krupa Sagari
WEB TECHNOLOGY LAB
(JNTUK Syllabus)

Experiment 1:
Develop static pages (using HTML and CSS) of an online book store. The pages should resemble: www. Flipkart.com
The website should contain the following pages
a) Home page
b) Registration and user login
c) User Profile Page
d) Books catalog
e) Shopping Cart
f) Payment By credit card
g) Order Conformation
Experiment 2:
Create and save an XML document on the server, which contains 10 users information. Write a program,
which takes User Id as an input and returns the user details by taking the user information fom the XML
document.
Experiment 3:
Write a PHP script to merge two arrays and sort them as numbers, in descending order.
Experiment 4:
Write a PHP script that reads data from one file and write into another file.
Experiment 5:
Write a PHP script print prime numbers between 1-50.
Experiment 6:
Validate the Registration, user login, user profile and payment by credit card pages using JavaScript
Experiment 7:
Write a PHP script to: a) find the length of a string b) Count no of words in a string. c) Reverse a String d)
Search for a specific string
Experiment 8:
Install TOMCAT web server. Convert the static web pages of assignments 2 into dynamic web pages using
servlets and cookies. Hint: Users information (user id, password, credit card number ) would be stored in
web.xml. Each user should have a seperate Shopping Cart
Experiment 9:
Redo the previous task using JSP by converting the static web pages of assignments 2 into dynamic web pages. Create
a database with user information and books information. The books catalogue should be dynamically loaded from the
database. Follow the MVC architecture while doing the website
Experiment 10:
Install a database (Mysql or Oracle). Create a table which should contain at least the following fields: name,
password, email-id, phone number (these should hold the data from the registration form). Practice ‘JDBC’
connectivity. Write a java program/servlet/JSP to connect to that database and extract data from the tables
and display them, Experiment with various SQL queries. Insert the details of the users who register with the
website, whenever a new user clicks the submit button in the registration page.
Experiment 11:
Write a JSP which does the following job: Insert the details of the 3 or 4 users who register with the web site
(week9) by using registration form. Architecture the user when he submits the login form using the
username and password from the database.
Experiment 12:
Create a simple visual bean with a area filled with a color. The shape of the area depends on the property
shape. If it is set to true then the shape of the area is Square and it is Circle, if it is false. The color of the
area should be changed dynamically for every mouse click.
Experiment 13:
Validate the registration, user login, user profile and payment by credit card pages using JavaScript.
Experiment 14:
MySQLi connectivity, INSERT, SELECT, DELETE with PHP
Experiment 1:
Develop static pages (using HTML and CSS) of an online book store. The pages should resemble: www. Flipkart.com
The website should contain the following pages
a) Home page
b) Registration and user login
c) User Profile Page
d) Books catalog
e) Shopping Cart
f) Payment By credit card
g) Order Conformation

PROCEDURE:
Home page
Main.html:

<html>
<head>
<title>Flipkart</title>
</head>
<body bgcolor="cyan"> <center>
<strong><h1>Welcome to Flipkart </h1></strong>
<form method="post" action="login.html" target=_blank >
<h4>for books</h4><input type="submit" value="click here">
</form>
</center>
</body>
</html>

Registration and user Login


Login.html:
<html>
<head>
<title>
login page</title>
</head>
<body bgcolor="cyan"> <center>
<strong><h1> FLIPKART </h1></strong></center> <right>
<table align="right">
<tr>
<td><h4>user name</td>
<td><input type="text" ></td>
<td></td>
</tr>
<tr>
<td><h4>password</td>
<td><input type="password"></td>
<td></td>
</tr>
<tr>
<td>
<form method="post" action="catalog.html" >
<input type="submit" value="submit" >
</form>
</td>
<td>
<form method="post" action="userpro.html" >
<input type="submit" value="register" >
&nbsp;&nbsp;
<input type="reset" value="reset"></form></td> </tr>
</table>
</body>
</html>

User profile page


Userpro.html:
<html>
<head>
<title>
login page</title>
</head>
<body bgcolor="cyan">
<center><strong><h1> FLIPKART </h1></strong></center> <form method="post" action="catalog.html"
> <right>
<table align="left">
<tr>
<td><h4>user name</td>
<td><input type="text" ></td>
<tr>
<tr>
<td><h4>password</td>
<td><input type="password"></td>
</tr>
<tr>
<td><h4>confirm password</td>
<td><input type="password"></td>
</tr>
<tr>
<td><h4>male &nbsp;&nbsp;
<option >
<input type="radio" name="sex" id="male"></td> <td><h4>female &nbsp; &nbsp;
<input type="radio" name="sex" id="female" ></td>
</option>
</tr>
<tr>
<td>Address</td>
<td><textarea name="address" rows=5 cols=19>
</textarea>
</td>
<tr>
<td>
<input type="submit" value="submit" ></td>
<td>
<input type="reset" value="reset"></td>
</tr>
</form>
</body>
</html>
 Books catalog
Catalog.html:
<html>
<head>
<title>
books catalog</title>
</head>
<body bgcolor="cyan">
<center><h1>FLIPKART</h1></center>
<form method="post" action="shopping.html">
<left>
<table>
<tr>
<td><b><h3>frontend books</td>
<td></td></tr>
<tr>
<td></td>
<td><h4>C&Ds</td>
</tr>
<tr>
<td></td>
<td><h4>Ads</td>
</tr>
<tr>
<td></td>
<td><h4>JAVA
</td></tr>
<tr>
<td><b><h3>backend books</td>
<td></td>
</tr>
<tr>
<td></td>
<td><h4>Oracle</td>
</tr>
<tr>
<td></td>
<td><h4>Ms SQL Server
</td></tr>
<tr>
<td></td>
<td><h4>MySql </td>
</tr>
</table>
</h4>
<center>
<b>for buy one of these books
<br>
</b><input type="submit" value="click here">
</center>
</form>
</body>
</html>
Shopping cart
Shopping.html:
<html>
<head><title>shopping cart</title>
</head>
<body bgcolor="cyan">
<center><h1>
Shopping Cart</h1></center>
<br><br><br><br><br>
<table align="center">
<tr>
<td>Text Books</td>
<td>
<select >
<optgroup label="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 </optgroup>
</select>
</td></tr>
<tr>
<td>
Quantity</td>
<td>
<input type="text" id="q">
</td></tr>
<tr>
<td></td>
<td>
<form method=post action="payment.html">
<input type="submit" value=ok />
</form>
</td></tr>
</table>
<center>
<pre>Cost of one book is"500" + shipping "100"</pre>
</center>
<body>
</html>

Payment by credit card


Payment.html:
<html>
<head><title>payment</title></head>
<body bgcolor="cyan">
<center><h1>Payment By Credit Card</h1></center>
<form method=post action="ordrconform.html">
<br><br><br><br><br>
<table align="center">
<tr>
<td>
<h4>Total Amount</h4></td>
<td><input type="text">
</td>
</tr>
<tr>
<td><h4>Credit Card Number</td>
<td><input type="text"></td>
</tr>
<tr>
<td>
</td>
<td><input type="submit" value=OK>
</td>
</tr>
</table>
</form></body>
</html>

Order Conformation
Ordrconform:
<html>
<head><title>order conformation</title><M/head>
<body bgcolor="cyan">
<center>
<h1><b>BOOK SHOPPING</h1>
<pre><strong>
<b>Your order Is Conformed
</strong></pre>
<h2><b>THANK YOU</h2>
</center>
</body></html>

OUTPUT:
Experiment 2:
Create and save an XML document on the server, which contains 10 users information. Write a program,
which takes User Id as an input and returns the user details by taking the user information fom the XML
document.
users.xml

<usersinformation>
<user>
<rollno>501</rollno>
<name>aaa</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>502</rollno>
<name>bbb</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>503</rollno>
<name>ccc</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>504</rollno>
<name>ddd</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>505</rollno>
<name>eee</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>506</rollno>
<name>fff</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>507</rollno>
<name>ggg</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>508</rollno>
<name>hhh</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>509</rollno>
<name>iii</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
<user>
<rollno>510</rollno>
<name>jjj</name>
<branch>cse</branch>
<college>mrcet</college>
</user>
</usersinformation>

UserDemo.java
import java.io.File;
import javax.xml.parsers.*;
import org.w3c.dom.*;
import java.util.Scanner;
public class UserDemo
{
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:
Experiment 3:
Write a PHP script to merge two arrays and sort them as numbers, in descending order.
<html>
<body>
<?php
$a1=array(1,3,15,7,5);
$a2=array(4,3,20,1,6);
$num=array_merge($a1,$a2);
array_multisort($num,SORT_DESC,SORT_NUMERIC);
print_r($num);
?>
</body>
</html>

Output:-
Array ( [0] => 20 [1] => 15 [2] => 7 [3] => 6 [4] => 5 [5] => 4 [6] => 3 [7] => 3 [8] => 1 [9] => 1 )

Experiment 4:
Write a PHP script that reads data from one file and write into another file.
<html>
<body>
<?php
$myfile = fopen("sample.txt", "r") or die("Unable to open file!");
echo fread($myfile,filesize("sample.txt"));
fclose($myfile);
?>
</body>
</html>
Output: - Unable to open file!
Experiment 5:
Write a PHP script print prime numbers between 1-50.
<?php
$count = 0;
$num = 2;
while ($count < 15 )
{
$div_count=0;
for ( $i=1; $i<=$num; $i++)
{
if (($num%$i)==0)
{
$div_count++;
}
}
if ($div_count<3)
{
echo $num." , ";
$count=$count+1;
}
$num=$num+1;
}
?>
Output: -
2 , 3 , 5 , 7 , 11 , 13 , 17 , 19 , 23 , 29 , 31 , 37 , 41 , 43 , 47 ,
Experiment 6:
Validate the Registration, user login, user profile and payment by credit card pages using JavaScript.
PROCEDURE:
 Home page:
Main.html:
<html>
<frameset rows="25%,*">
<frame src="top.html" name="top" scrolling ="no" frameborder ="0">
<frameset cols="25%,75%">
<frame src="left.html" name="left" scrolling ="no" frameborder ="0">
<frame src="right.html" name="right" scrolling ="auto" frameborder ="0">
</frameset>
</frameset>
</html>
Top.html:
<html>
<body bgcolor="pink">
<br><br>
<marquee><h1 align=”center”><b><u>ONLINE BOOK STORAGE</u></b></h1></marquee>
</body>
</html>

Right.html:
<html>
<body>
<br><br><br><br><br>
<h2 align="center">
<b><p> welcome to online book storage. Press login if you are having id otherwise press registration. </p></b>
</h2>
</body>
</html>
Left.html:
<html>
<body bgcolor="pink">
<h3>
<ul> <li><a href="login.html" target="right"><font color="black"> LOGIN</font></a></li><br><br> <li>
<a href="profile.html" target="right"><font color="black"> USER PROFILE</font></a></li><br><br> <li>
<a href="catalog.html" target="right"><font color="black"> BOOKS CATALOG</font></a></li><br><br>
<li><a href="scart.html" target="right"><font color="black"> SHOPPINGCART</font></a></li><br><br>
<li><a href="payment.html" target="right"><font color="black"> PAYMENT</font></a></li>
<br><br> <br><br> </ul>
</body>
</html>

Registration and user Login


Login.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.id.value==""||
document.myform.pwd.value=="")
{
alert("LoginId and Password must be filled")
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
window.open("catalog.html","right");
}
else
{
alert("INVALID INPUT");
//document.myform.focus();
}
}
</script>
<form name="myform">
<div align="center"><pre>
LOGIN ID:<input type="text" name="id"><br>
PASSWORD:<input type="password" name="pwd"><br><br>
</pre>
<input type="button" value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset" value="clear" >
</div>
</form>
</body>
</html>
User profile page
Profile.html:
<html>
<body bgcolor="pink"><br><br>
<script type="text/javascript">
function validate()
{
var flag=1;
if(document.myform.name.value==""||
document.myform.addr.value==""||
document.myform.phno.value==""||
document.myform.id.value==""||
document.myform.pwd.value=="")
{
alert("Enter all the details");
flag=0;
}
var str=document.myform.phno.value;
var x=new RegExp("\\d","g");
if(!(str.match(x)))
{
if(!(str.length==10))
flag=0;
}
var str1=document.myform.id.value;
var x1=new RegExp("^[A-Z][a-zA-Z]+$","g");
if(!(str1.match(x1)))
{
flag=0;
alert("Invalid UserID");
}
var str1=document.myform.pwd.value;
var x1=new RegExp("^[A-Z][a-zA-Z]+$","g");
if(!(str1.match(x1)))
{
flag=0;
alert("Invalid password");
}
if(flag==1)
{
alert("VALID INPUT");
window.self.location.href="login.html";
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform">
<div align="center"><pre>
NAME :<input type="text" name="name"><br>
ADDRESS :<input type="type" name="addr"><br>
CONTACT NUMBER:<input type="text" name="phno"><br>
LOGINID :<input type="text" name="id"><br>
PASSWORD :<input type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
<input type="button" value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;
<input type="reset" value="clear">
</form></body></html>
Books catalog:
Scart.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.title.value=="")
{
flag=0;
}
str=document.myform.title.value;
if(str=="c"||str=="C")
{
document.myform.t1.value="C";
document.myform.t2.value=444;
}
else if(str=="jsp"||str=="JSP")
{
document.myform.t1.value="JSP";
document.myform.t2.value=555;
}
else
{
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform" action="payment.html" target="right">
<div align="center"><pre>
BOOK TITLE :<input type="text" name="title"><br>
</pre><br><br>
Book Title: <input type="text" name="t1" disabled>
Book Cost: <input type="text" name="t2" disabled>
</div>
<br><br>
<div align="center">
<input type="submit" value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset" value="clear">
<input type="submit" value="Purchase">
</form>
</body>
</html>
 Shopping cart:
Catalog.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.id.value==""||
document.myform.title.value==""||
document.myform.no.value==""||
document.myform.cost.value=="")
{
flag=0;
}
str=document.myform.title.value;
var str1=document.myform.cost.value;
if(!((str=="c"&& str1==444) || (str=="jsp" && str1==555)))
{
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform" action="scart.html" target="right">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br>
TITLE :<input type="text" name="title"><br>
NO.OF BOOKS :<input type="text" name="no"><br>
COST OF BOOK :<input type="text"name="cost"><br>
</pre><br><br>
</div>
<br><br>
<div align="center">
<input type="submit" value="ok" onClick="validate()"> &nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset" value="clear">
</form>
</body>
</html>
 Payment by credit card
Payment.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.id.value==""|| document.myform.pwd.value==""||
document.myform.amount.value==""|| document.myform.num.value=="")
{
flag=0;
}
var str=document.myform.amount.value;
var x=new RegExp("\\d","g");
if(!(str.match(x)))
{
flag=0;
}
var str1=document.myform.num.value;
var x1=new RegExp("\\d","g");
if(!(str.match(x1)))
{
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
window.self.location.href="order.html";
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br>
PASSWORD :<input type="password" name="pwd"><br>
AMOUNT :<input type="text" name="amount"><br>
CREDITCARDNUMBER :<input type="PASSWORD" name="num"><br></pre><br><br>
</div>
<br><br>
<div align="center">
<input type="button" value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset" value="clear" >
</form>
</body>
</html>
Order Conformation
Order.html:
<html>
<head><title>order conformation</title><M/head>
<body bgcolor="cyan">
<center>
<h1><b>FLIPKART</h1>
<pre><strong>
<b>Your order Is Conformed
</strong></pre>
<h2><b>THANK YOU</h2>
</center>
</body> </html>
Experiment 7:
Write a PHP script to: a) find the length of a string b) Count no of words in a string. c) Reverse a String d)
Search for a specific string
<?php
$str1 = 'Hello world!';
echo 'Length of $str1 is - ' . strlen($str1);
echo "<br>";
$str2 = ' Hello world! ';
echo 'Count the number of words in $str2 is - ' .str_word_count($str2);
echo "<br>";
echo 'Reverse the $str2 is - ' . strrev($str2);
echo "<br>";
echo 'Search the $str2 is - ' .strrchr("I love php, I love php too!","php")
?>
OUTPUT:
Length of $str1 is - 12
Count the number of words in $str2 is - 2
Reverse the $str2 is - !dlrow olleH
Search the $str2 is - p too!

Experiment 8:
Install TOMCAT web server. Convert the static web pages of assignments 2 into dynamic web pages using
servlets and cookies. Hint: Users information (user id, password, credit card number ) would be stored in
web.xml. Each user should have a seperate Shopping Cart
Install the TOMCAT web server:
Step 1:
Installation of JDK:
Before beginning the process of installing Tomcat on your system, ensure first the availability of
JDK on your system program directory. Install it on your system if not already installed (because
any version of tomcat requires the Java 1.6 or higher versions) and then set the class path
(environment variable) of JDK. To set the JAVA_HOME Variable: you need to specify the
location of the java run time environment to support the Tomcat else Tomcat server can not run.
This variable contains the path of JDK installation directory.
set JAVA_HOME=C:\Program Files\Java\jdk1.6
Note: it should not contain the path up to bin folder. Here, we have taken the URL path
according to our installation convention.
For Windows OS, go through the following steps:
First, right click on the
My Computer->properties->advance->Environment
Variables->New->set the Variable name =
JAVA_HOME and variable value = C:\Program
Files\Java\jdk1.6
Now click on all the subsequent ok buttons one by one. It will set the JDK path.
Step 2:
For setting the class path variable for JDK, do like this:

First, right click on the

My Computer->properties->advance->Environment
Variables->path.

Now, set bin directory path of JDK in the path variable

Step 3:
The process of installing Tomcat 6.0 begins here from now. It takes various steps for installing and
configuring the Tomcat 6.0
For Windows OS, Tomcat comes in two forms: .zip file and .exe file (the Windows installer file).
Here we are exploring the installation process by using the .exe file. First unpack the zipped file
and simply execute the '.exe' file

A Welcome screen shot appears that shows the beginning of installation process. Just
click on the 'Next' button to proceed the installation process.
Steps 4:
A screen of 'License Agreement' displays.
Click on the 'I Agree' button
Step 5:
A screen shot appears asking for the 'installing location'

Choose the default components and click on the 'Next' button.

Step 6:
A screen shot of 'Configuration Options' displays on the screen. Choose the location for the Tomcat files as
per your convenience. You can also opt the default Location
The port number will be your choice on which you want to run the tomcat server. The port number
8080 is the default port value for tomcat server to proceed the HTTP requests. The user can also
change the 'port number' after completing the process of installation; for this, users have to follow
the following tips.

Go to the specified location as " Tomcat 10.0 \conf \server.xml ". Within the server.xml file
choose "Connector" tag and change the port number.

Now, click on the 'Next' button to further proceed the installation process.
Step 7:
A Window of Java Virtual Machine displays on the screen
This window asks for the location of the installed Java Virtual Machine. Browse the location of the JRE
folder and click on the Install button. This will install the Apache tomcat at the specified location
Step 8:
A processing window of installing displays on the screen

To get the information about installer click on the "Show details" button
Step 9:
A screen shot of 'Tomcat Completion' displays on the screen

Click on the 'Finish' button


Step 10:
A window of Apache Service Manager appears with displaying the running process

Let the running process goes on.


Step 11:
After completing the installation process, the Apache Tomcat Manager appears on the toolbar panel like
shown in the below picture

Apache Tomcat Manager

Web.xml
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<display-name>Servlet 2.4 Examples</display-name>
<description> Servlet 2.4 Examples. </description>
<servlet>
<servlet-name>reg</servlet-name>
<servlet-class>reg</servlet-class>
</servlet>
<servlet>
<servlet-name>login</servlet-name>
<servlet-class>login</servlet-class>
</servlet>
<servlet>
<servlet-name>profile</servlet-name>
<servlet-class>profile</servlet-class>
</servlet>
<servlet>
<servlet-name>catalog</servlet-name>
<servlet-class>catalog</servlet-class>
<servlet-mapping>
<servlet-name>order</servlet-name>
<url-pattern>
</servlet>
<servlet>
<servlet-name>order</servlet-name>
<servlet-class>order</servlet-class>
</servlet>
<url-pattern>order</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>catalog</servlet-name>
<url-pattern>catalog</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>profile</servlet-name>
<url-pattern>profile</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>login</servlet-name>
<url-pattern>login</url-pattern>
</servlet-mapping>
<servlet-mapping> <servlet-name>reg</servlet-name> <url-pattern>reg</url-pattern>
</servlet-mapping></web-app>

Main.html:
<html>
<body bgcolor=”pink”>
<br><br><br><br><br><br>
<h1 align=”center”>>U>ONLINE BOOK STORAGE</u></h1><br><br><br>
<h2 align=”center”><PRE>
<b> Welcome to online book storage. Press LOGIN if you are having id
Otherwise press REGISTRATION
</b></PRE></h2>
<br><br><pre>
<div align=”center”><a href=”/tr/login.html”>LOGIN</a>
<a href=”login.html”>REGISTRATION</a></div></pre>
</body></html>
Login.html:
<html>
<body bgcolor=”pink”><br><br><br>
<form name="myform" method="post" action=/tr1/login.jsp">
<div align="center"><pre>
LOGIN ID : <input type="passwors" name="pwd"></pre><br><br> PASSWORD : <input
type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset"
value="clear">
</form>
</body>
</html>
Reg.html:
<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/reg.jsp">
<div align="center"><pre>
NAME:<input type="text" name="name"><br> ADDRESS :<input type="text" name="addr"><br>
CONTACT NUMBER : <input type="text" name="phno"><br> LOGIN ID
: <input type="text" name="id"><br>
PASSWORD : <input type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset" value="clear">
</form>
</body>
</html>
Profile.html:
<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/profile.jsp">
<div align="center"><pre>
LOGIN ID : <input type="text" name="id"><br>
</pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset" value="clear">
</form>
</body>
</html>

Catalog.html:
<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/catalog.jsp">
<div align="center"><pre>
BOOK TITLE : <input type="text" name="title"><br>
</pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok"
name=”button1”>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<inputtype="reset"value="clear" name=”butt on2”>
</form>
</body>
</html>
Order.html:
<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/order.jsp">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br> PASSWORD : <input type="password"
name="pwd"><br> TITLE :<input type="text" name="title"><br>
NO. OF BOOKS : <input type="text" name="no"><br> DATE : <input type="text" name="date"><br>
CREDIT CARD NUMBER : <input type="password" name="cno"><br></pre><br><br>
</div>
<br><br>
<div align="center">
<input type="submit" value="ok" name=”button1”>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="reset"
value="clear" name=”button2”>
</form>
</body>
</html>
Login.java
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class login extends HttpServlet{
public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
PrintWriter pw=resp.getWriter();
pw.println("<html><body bgcolor=\"pink\");
String id=req.getParamenter("id");
String pwd=req.getParameter("pwd");
try {
Driver d=new oracle.jdbc.driver.OracleDriver(); DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:orcl","scott","tiger");
Statement stmt=con.createStatement();
String sqlstmt="select id,password from login";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0;
while(rs.next()) {
if(id.equal(rs.getString(1))&&pwd.equals(rs.getString(2))) {
flag=1;
}
}
if(flag==0) {
pw.println("SORRY INVALID ID TRY AGAIN ID<br><br>");
pw.println("<a href=\"/tr/login.html\">press LOGIN to RETRY</a>");
}
else {
pw.println("VALID LOGIN ID<br><br>");
pw.println("<h3><ul>");
pw.println("<li><ahref=\"profile.html\"><fontcolor=\"black\">USER PROFILE</font> </a></li><br><br>");
pw.println("<li><ahref=\"catalog.html\"><fontcolor=\"black\">BOOKS CATALOG</font></a></li><br><br>");
pw.println("<li><ahref=\"order.html\"><fontcolor=\"black\">ORDER CONFIRMATION</font>
</a></li><br><br>");
}
pw.println("</body></html>");
}
catch(Exception e) { resp.sendError(500,e.toString());
}
}
Reg.java
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class login extends HttpServlet{
public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
PrintWriter pw=resp.getWriter();
pw.println("<html><body bgcolor=\"pink\");
String name=req.getParamenter("name");
String addr=req.getParameter("addr");
String phno=req.getParameter("phno");
String id=req.getParamenter("id");
String pwd=req.getParameter("pwd");
int no=Integer.parseInt(phno);
try {
Driver d=new oracle.jdbc.driver.OracleDriver(); DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:orcl","scott","tiger");
Statement stmt=con.createStatement();
String sqlstmt="select id,password from login";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0;
while(rs.next()) {
if(id.equal(rs.getString(1))&&pwd.equals(rs.getString(2))) {
flag=1;
}}
if(flag==1) {
pw.println("SORRY INVALID ID ALREADY EXITS TRY AGAIN WITH NEW
ID<br><br>");
pw.println("<a href=\"/tr/reg.html\">press REGISTER to RETRY</a>");
}
else {
Statement stmt1=con.createStatement(); stmt1.executeUpdate("insertintologin
values("+names","+addr+","+no+","+id+","+pwd+")");
pw.println("YOUR DETAILS ARE ENTERED<br><br>");
pw.println("<a href=\"/tr/login.html\">press LOGIN to login</a>");
}
pw.println("</body></html>");
}
catch(Exception e) { resp.sendError(500,e.toString());
} }}

Catlog.java
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class login extends HttpServlet{
public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
PrintWriter pw=resp.getWriter();
pw.println("<html><body bgcolor=\"pink\");
String title=req.getParameter("title");
try {
Driver d=new oracle.jdbc.driver.OracleDriver(); DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:orcl","scott","tiger");
Statement stmt=con.createStatement();
String sqlstmt="select id,password from login";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0; while(rs.next()) {
pw.println(",div align=\"center\">");
pw.println("TITLE :"+rs.getString(1)+"<br>");
pw.println("AUTHOR :"+rs.getString(2)+"<br>");
pw.println("VERSION :"+rs.getString(3)+"<br>");
pw.println("PUBLISHER :"+rs.getString(4)+"<br>");
pw.println("COST :"+rs.getString(5)+"<br>");
pw.println("</div");
flag=1;
}
if(flag==0) {
pw.println("SORRY INVALID TITLE TRY AGAIN <br><br>");
pw.println("<a href=\"/tr/catalog.html\">press HERE to RETRY</a>");
}
pw.println("</body></html>");
}
catch(Exception e) { resp.sendError(500,e.toString());
}
}
}
Profile.java
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class login extends HttpServlet{
public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
PrintWriter pw=resp.getWriter();
pw.println("<html><body bgcolor=\"pink\");
String id=req.getParamenter("id");
try {
Driver d=new oracle.jdbc.driver.OracleDriver();
DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection("jdbc:oracle:thin: @localhost:1521:orcl","scott","tiger");
Statement stmt=con.createStatement();
String sqlstmt="select * from login where id="+id+"";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0; pw.println("<br><br><br>");
while(rs.next()) {
pw.println("<div align=\"center\">");
pw.println("NAME :"+rs.getString(1)+"<br>");
pw.println("ADDRESS :"+rs.getString(2)+"<br>");
pw.println("PHONE NO :"+rs.getString(3)+"<br>");
pw.println("</div>");
flag=1;
}
if(flag==0) {
pw.println("SORRY INVALID ID TRY AGAIN ID<br><br>");
pw.println("<a href=\"/tr/profile.html\">press HERE to RETRY</a>");
}
pw.println("</body></html>");
}
catch(Exception e) { resp.sendError(500,e.toString());
}
}
}
Order.java
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class login extends HttpServlet{
public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
PrintWriter pw=resp.getWriter();
pw.println("<html><body bgcolor=\"pink\");
String id=req.getParamenter("id");
String pwd=req.getParameter("pwd");
String title=req.getParameter("title");
String count1=req.getParameter("no");
String date=req.getParameter("date");
String cno=req.getParameter("cno");
int count=Integer.parseInt(count1);
try {
Driver d=new oracle.jdbc.driver.OracleDriver();
DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:orcl","scott","tiger")
;
Statement stmt=con.createStatement();
String sqlstmt="select id,password from login";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0,amount,x;
while(rs.next()) {
if(id.equals(rs.getString(1))&&pwd.equals(rs.getString(2))) {
flag=1;
}
}
if(flag==0) {
pw.println("SORRY INVALID ID TRY AGAIN ID<br><br>");
pw.println("<a href=\\"/tr/order.html\\">press HERE to RETRY</a>");

}
else {
Statement stmt2=con.createStatement();
String s="select cost from book where title="+title+"";
ResultSet rs1=stmt2.executeQuery(s);
int flag1=0;
while(rs1.next()) {
flag1=1;
x=Integer.parseInt(rs1.getString(1));
amount=count*x;
pw.println("AMOUNT :"+amount+"<br><br><br><br>");
Statement stmt1=con.createStatement();
stmt1.executeUpdate("insertintodetails values('"+id+",'"+title+"'+amount+'","'+cno+'")"');
pw.println("YOUR ORDER has taken<br>");
}
if(flag1==0) {
pw.println("SORRY INVALID ID TRY AGAIN ID<br><br>");
pw.println("<a href=\\"/tr/order.html\\">press HERE to RETRY</a>");

}
}
pw.println("</body></html>");
con.close();
}
catch(Exception e) { resp.sendError(500,e.toString());
}
}
Output:
Experiment 9:
Redo the previous task using JSP by converting the static web pages of assignments 2 into dynamic web pages. Create
a database with user information and books information. The books catalogue should be dynamically loaded from the
database. Follow the MVC architecture while doing the website

AIM:
1) Create your own directory under tomcat/webapps (e.g. tr1)
2) Copy the html files in tr1
3) Copy the jsp files also into tr1
4) Start tomcat give the following command Catalina.bat run At install‐dir/bin
5) at I.E give url as http://localhost:8081/tr1/main.html

Main.html:
<html>
<body bgcolor=”pink”>
<br><br><br><br><br><br>
<h1 align=”center”>>U>ONLINE BOOK STORAGE</u></h1><br><br><br>
<h2 align=”center”><PRE>
<b> Welcome to online book storage. Press LOGIN if you are having id
Otherwise press REGISTRATION
</b></PRE></h2>
<br><br><pre>
<div align=”center”><a href=”/tr/login.html”>LOGIN</a>
<a href=”login.html”>REGISTRATION</a></div></pre>
</body></html>
Login.html:
<html>
<body bgcolor=”pink”><br><br><br>
<form name="myform" method="post" action=/tr1/login.jsp">
<div align="center"><pre>
LOGIN ID : <input type="passwors" name="pwd"></pre><br><br> PASSWORD : <input
type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset"
value="clear">
</form>
</body>
</html>
Reg.html:
<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/reg.jsp">
<div align="center"><pre>
NAME:<input type="text" name="name"><br> ADDRESS :<input type="text" name="addr"><br>
CONTACT NUMBER : <input type="text" name="phno"><br> LOGIN ID
: <input type="text" name="id"><br>
PASSWORD : <input type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset" value="clear">
</form>
</body>
</html>
Profile.html:
<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/profile.jsp">
<div align="center"><pre>
LOGIN ID : <input type="text" name="id"><br>
</pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok" onClick="validate()">()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input
type="reset" value="clear">
</form>
</body>
</html>

Catalog.html:
<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/catalog.jsp">
<div align="center"><pre>
BOOK TITLE : <input type="text" name="title"><br>
</pre><br><br>
</div>
<br><br>
<div align="center">
<inputtype="submit"value="ok"
name=”button1”>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<inputtype="reset"value="clear" name=”butt on2”>
</form>
</body>
</html>
Order.html:
<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/order.jsp">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br> PASSWORD : <input type="password"
name="pwd"><br> TITLE :<input type="text" name="title"><br>
NO. OF BOOKS : <input type="text" name="no"><br> DATE : <input type="text" name="date"><br>
CREDIT CARD NUMBER : <input type="password" name="cno"><br></pre><br><br>
</div>
<br><br>
<div align="center">
<input type="submit" value="ok" name=”button1”>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="reset"
value="clear" name=”button2”>
</form>
</body>
</html>
Login.jsp:
<%@page import=”java.sql.*”%>
<%@page import=”java.io.*”%>
<%
out.println(“<html><body bgcolor=\”pink\”>”);
String id=request.getParameter(“id”);
String pwd=request.getParameter(“pwd”);
Driver d=new oracle.jdbc.driver.OracleDriver();
DriverManager.registerDriver(d);
Connection con=DriverManager.getConnection(“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=con.createStatement();
String sqlstmt=”select id,password from login where id=”+id+” and password=”+pwd+””;
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0;
while(rs.next())
{
flag=1;
}
if(flag==0)
{
out.println(“SORRY INVALID ID TRY AGAIN ID<br><br>”);
out.println(“ <a href=\”/tr1/login.html\”>press LOGIN to RETRY</a>”);
}
else
{
out.println(“VALID LOGIN ID<br><br>”); out.println(“<h3><ul>”);
out.println(“<li><ahref=\”profile.html\”><fontcolor=\”black\”>USER
PROFILE</font></a></li><br><br>”);
out.println(“<li><ahref=\”catalog.html\”><fontcolor=\”black\”>BOOKS
CATALOG</font></a></li><br><br>”);
out.println(“<li><ahref=\”order.html\”><fontcolor=\”black\”>ORDER
CONFIRMATION</font></a></li><br><br>”);
out.println(“</ul>”);
}
out.println(“<body></html>”);
%>
Reg.jsp:
<%@page import=”java.sql.*”%>
<%@page import=”java.io.*”%>
<%
out.println(“<html><body bgcolor=\”pink\”>”);
String name=request.getParameter(“name”);
String addr=request.getParameter(“addr”);
String phno=request.getParameter(“phno”);
String id=request.getParameter(“id”);
String pwd=request.getParameter(“pwd”);
int no=Integer.parseInt(phno);
Driver d=new oracle.jdbc.driver.OracleDriver();
DriverManager.registerDriver(d);
Connection con=
DriverManager.getConnection (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=con.createStatement();
String sqlstmt=”select id from login”; ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0;
while(rs.next())
{
if(id.equals(rs.getString(1)))
{
flag=1;
}
}
if(flag==1)
{
out.println(“SORRY LOGIN ID ALREADY EXISTS TRY AGAIN WITH NEW ID
<br><br>”);
out.println(“<a href=\”/tr1/reg.html\”>press REGISTER to RETRY</a>”);
}
else
{
Statement stmt1=con.createStatement ();
stmt1.executeUpdate (“insert into login values (“+name+”,”+addr+”,”+no+”,”+id+”,”+pwd+”)”); out.println
(“YOU DETAILS ARE ENTERED <br><br>”);
out.println (“<a href =\”/tr1/login.html\”>press LOGIN to login</a>”);
} out.println (“</body></html>”);%>
Profile.jsp:
<%@page import=”java.sql.*”%>
<%@page import=”java.io.*”%>
<%
out.println (“<html><body bgcolor=\”pink\”>”); String id=request.getParameter(“id”);
Driver d=new oracle.jdbc.driver.OracleDriver(); DriverManager.regiserDriver(d);
Connection con=
DriverManager.getConnection (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”); Statement
stmt=con.createStatement ();
String sqlstmt=”select * from login where id=”+id+””; ResultSet rs=stmt.executeQuery (sqlstmt);
int flag=0; while(rs.next())
{
out.println (“<div align=\”center\”>”);
out.println (“NAME :”+rs.getString(1)+”<br>”); out.println (“ADDRESS :”+rs.getString(2)+”<br>”);
out.println (“PHONE NO :”+rs.getString(3)+”<br>”); out.println (“</div>”);
flag=1;
}
if(flag==0)
{
out.println(“SORRY INVALID ID TRY AGAIN ID <br><br>”);
out.println(“<a href=\”/tr1/profile.html\”>press HERE to RETRY </a>”);
}
out.println (“</body></html>”);
%>
Catalog.jsp:
<%@page import=”java.sql.*”%>
<%@page import=”java.io.*”%>
<%
out.println (“<html><body bgcolor=\”pink\”>”);
String title=request.getParameter (“title”);
Driver d=new oracle.jdbc.driver.OracleDriver ();
DriverManager.regiserDriver (d);
Connection con=
DriverManager.getConnection (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=con.createStatement ();
String sqlstmt=”select * from book where title=”+title+””;
ResultSet rs=stmt.executeQuery (sqlstmt);
int flag=0; while(rs.next())
{
out.println (“<div align=\”center\”>”);
out.println (“TITLE :”+rs.getString(1)+”<br>”);
out.println (“AUTHOR :”+rs.getString(2)+”<br>”);
out.println (“VERSION:”+rs.getString(3)+”<br>”);
out.println (“PUBLISHER :” +rs.getString(4)+”<br>”);
out.println (“COST :” +rs.getString(5)+”<br>”);
out.println (“</div>”);
flag=1;
}
if(flag==0)
{
out.println(“SORRY INVALID ID TRY AGAIN ID <br><br>”);
out.println(“<a href=\”/tr1/catalog.html\”>press HERE to RETRY </a>”);
}
out.println (“</body></html>”);
%>
Order.jsp:
<%@page import=”java.sql.*”%>
<%@page import=”java.io.*”%>
<%
out.println (“<html><body bgcolor=\”pink\”>”);
String id=request.getParameter (“id”);
String pwd=request.getParameter (“pwd”);
String title=request.getParameter (“title”);
String count1=request.getParameter (“no”);
String date=request.getParameter (“date”);
String cno=request.getParameter (“cno”);
int count=Integer.parseInt(count1);
Driver d=new oracle.jdbc.driver.OracleDriver ();
DriverManager.regiserDriver (d);
Connection con=DriverManager.getConnection (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=con.createStatement ();
String sqlstmt=”select id, password from login”;
ResultSet rs=stmt.executeQuery (sqlstmt);
int flag=0,amount,x;
while(rs.next())
{
if(id.equals(rs.getString(1))&& pwd.equals(rs.getString(2)))
{
flag=1;
}
}
if(flag==0)
{
out.println(“SORRY INVALID ID TRY AGAIN ID <br><br>”);
out.println(“<a href=\”/tr1/order.html\”>press HERE to RETRY </a>”)
}
else
{
Statement stmt2=con.createStatement();
String s=”select cost from book where title=”+title+””;
ResultSet rs1=stmt2.executeQuery(s);
int flag1=0; while(rs1.next())
{
flag1=1; x=Integer.parseInt(rs1.getString(1));
amount=count*x;
out.println(“AMOUNT :”+amount+”<br><br><br><br>”);
Statement stmt1=con.createStatement ();
stmt1.executeUpdate (“insert into details (“+id+”,”+title+”,”+amount+”,”+date+”,”+cno+”)”);
out.println (“YOU ORDER HAS TAKEN<br>”);
}
if(flag1==0)
{
out.println(“SORRY INVALID BOOK TRY AGAIN <br><br>”);
out.println(“<a href=\”/tr1/order.html\”>press HERE to RETRY </a>”);
}
} out.println (“</body></html>”);%>
Experiment 10:
Install a database (Mysql or Oracle). Create a table which should contain at least the following fields: name,
password, email-id, phone number (these should hold the data from the registration form). Practice ‘JDBC’
connectivity. Write a java program/servlet/JSP to connect to that database and extract data from the tables
and display them, Experiment with various SQL queries. Insert the details of the users who register with the
website, whenever a new user clicks the submit button in the registration page.
AIM: Install a database (Mysql or Oracle).

DESCRIPTION:

JDBC Driver Types


There are four types of JDBC drivers in use:
Type 1: JDBC-ODBC Bridge
A Type 1 JDBC-ODBC Bridge provides application developers with a way to access
JDBC drivers via the JDBC API. Type 1 JDBC drivers translate the JDBC calls into ODBC
calls and then send the calls to the ODBC driver. Type 1 JDBC drivers are generally used
when the database client libraries need to be loaded on every client machine.
Type 2: Native API/Partly Java Driver
A Type 2 Native API/Partly Java Driver is a partial Java driver because it converts
JDBC calls into database specific calls. Type 2 Native API/Partly Java Driver communicates
directly with the database server.
Type 3: Pure Java Driver
A Type 3 Pure Java Driver works in a three tiered architecture. The JDBC calls are passed via
the network to the middle tier server. This server translates the calls to the database specific
native interface to further request the server. JDBC drivers available from Simba are Type 3
drivers.
Type 4: Native Protocol Java Driver
The type 4 driver is written completely in Java and is hence platform independent. It is
installed inside the Java Virtual Machine of the client. It provides better performance over the
type 1 and 2 drivers as it does not have the overhead of conversion of calls into ODBC or
database API calls. Unlike the type 3 drivers, it does not need associated software to work.A
Type 4 Native Protocol Java Driver converts JDBC calls into the database specific calls so that
the client applications can communicate directly with the server.

PROGRAM:
Registration.html:
<html>
<head>
<title>Registration page</title>
</head>
<body bgcolor="#00FFFf">
<form METHOD="POST" ACTION="register">
<CENTER>
<table>
<center>
<tr> <td> Username </td>
<td><input type="text" name="usr"> </td> </tr>
<tr><td> Password </td>
<td><input type="password" name="pwd"> </td> </tr>
<tr><td>Age</td>
<td><input type="text" name="age"> </td> </tr>
<tr> <td>Address</td>
<td> <input type="text" name="add"> </td> </tr>
<tr> <td>email</td>
<td> <input type="text" name="mail"> </td> </tr>
<tr> <td>Phone</td>
<td> <input type="text" name="phone"> </td> </tr>
<tr> <td colspan=2 align=center> <input type="submit" value="submit"> </td> </tr>
</center>
</table>
</form>
</body>

Login.html
<html>
<head>
<title>Registration page</title>
</head>
<body bgcolor=pink> <center> <table>
<form METHOD="POST" ACTION="authent">
<tr> <td> Username </td>
<td><input type="text" name="usr"></td> </tr>
<tr> <td> Password </td>
<td> <input type="password" name="pwd"> </td> </tr>
<tr> <td align=center colspan="2"><input type="submit" value="submit"></td> </tr>
</table> </center>
</form>
</body>
</html>
Ini.java:
import javax.servlet.*; import
java.sql.*; import java.io.*;
public class Ini extends GenericServlet
{
private String user1,pwd1,email1;

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


{
user1=req.getParameter("user");
pwd1=req.getParameter("pwd");
email1=req.getParameter("email");
res.setContentType("text/html"); PrintWriter
out=res.getWriter();
try
{
Class.forName("oracle.jdbc.driver.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@195.100.101.158:1521:cclab","scott","tiger");
PreparedStatement st=con.prepareStatement("insert into personal values(?,?,?,?,?,?)"); st.setString(1,user1);
st.setString(2,pwd1); st.setString(3,"25");
st.setString(4,"hyd");
st.setString(5,email1);
st.setString(6,"21234");
st.executeUpdate(); con.close();
}
catch(SQLException s)
{ out.println("not found "+s);
}
catch(ClassNotFoundException c)
{
out.println("not found "+c);
}
}}

web.xml:
<web-app>
<servlet>
<servlet-name>init1</servlet-name>
<servlet-class>Ini</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>init1</servlet-name>
<url-pattern>/regis</url-pattern>
</servlet-mapping>
</web-app>

OUTPUT:
Experiment 11:
Write a JSP which does the following job: Insert the details of the 3 or 4 users who register with the web site
(week9) by using registration form. Architecture the user when he submits the login form using the
username and password from the database.

AIM: Write a JSP which does the following job


Insert the details of the 3 or 4 users who register with the web site (week9) by using
registration form. Authenticate the user when he submits the login form using the user name
and password from the database

DESCRIPTION:

JSP Scripting Elements

JSP scripting elements let you insert Java code into the servlet that will be generated from
the current JSP page. There are three forms:

1. Expressions of the form <%= expression %> that are evaluated and inserted into the output,
2. Scriptlets of the form <% code %> that are inserted into the servlet's service
method, and
3. Declarations of the form <%! code %> that are inserted into the body of the servlet class,
outside of any existing methods.
Each of these is described in more detail below.

JSP Expressions
A JSP expression is used to insert Java values directly into the output. It has the following
form:
<%= Java Expression %>
The Java expression is evaluated, converted to a string, and inserted in the page. This evaluation is
performed at run-time (when the page is requested), and thus has full access to information
about the request. For example, the following shows the date/time that the page was requested:

Current time: <%= new java.util.Date() %>


To simplify these expressions, there are a number of predefined variables that you can use.
These implicit objects are discussed in more detail later, but for the purpose of expressions, the
most important ones are:

 request, the HttpServletRequest;


 response, the HttpServletResponse;
 session, the HttpSession associated with the request (if any); and
 out, the PrintWriter (a buffered version of type JspWriter) used to send output to the client.

JSP Scriptlets
If you want to do something more complex than insert a simple expression, JSP
scriptlets let you insert arbitrary code into the servlet method that will be built to generate the
page. Scriptlets have the following form:

<% Java Code %>


Scriptlets have access to the same automatically defined variables as expressions. So, for
example, if you want output to appear in the resultant page, you would use the out variable.

<%
String queryData = request.getQueryString();
out.println("Attached GET data: " + queryData);
%>
Note that code inside a scriptlet gets inserted exactly as written, and any static
HTML (template text) before or after a scriptlet gets converted to print statements. This means
that scriptlets need not contain complete Java statements, and blocks left open can affect the
static HTML outside of the scriptlets.
JSP Declarations
A JSP declaration lets you define methods or fields that get inserted into the main
body of the servlet class (outside of the service method processing the request). It has the
following form:

<%! Java Code %>


Since declarations do not generate any output, they are normally used in conjunction with JSP expressions or
scriptlets. For example, here is a JSP fragment that prints out the
number of times the current page has been requested since the server booted (or the servlet
class was changed and reloaded):

<%! private int accessCount = 0; %>

PROGRAM:
Login.html:
<!--Home.html-->
<html> <body>
<center><h1>XYZ Company Ltd.</h1></center>
<table border="1" width="100%" height="100%">
<tr>
<td valign="top" align="center"><br/>
<form action="auth.jsp"><table>
<tr>
<td colspan="2" align="center"><b>Login Page</b></td>
</tr>
<tr>
<td colspan="2" align="center"><b>&nbsp;</td>
</tr>
<tr>
<td>User Name</td>
<td><input type="text" name="user"/></td>
</tr>
<tr>
<td>Password</td>
<td> input type=”password” name=”pwd”></td>
</tr>
<tr>
<td> &nbsp; &nbsp; &nbsp;</td>
<td> &nbsp; &nbsp; &nbsp;</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="LogIN"/></td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</body>
</html>

Auth.jsp:
<%@page import="java.sql.*;"%>
<html>
<head>
<title>
This is simple data base example in JSP</title>
</title>
</head>
<body bgcolor="yellow">
<%!String uname,pwd;%>
<%
uname=request.getParameter("user"); pwd=request.getParameter("pwd"); try
{
Class.forName("oracle.jdbc.driver.OracleDriver");
Connection
con=DriverManager.getConnection("jdbc:oracle:thin:@195.100.101.158:1521:CCLAB","scott","tiger ");
Statement st=con.createStatement();
ResultSet rs=st.executeQuery("select name,password from personal where name='"+uname+"' and
password='"+pwd+"'");
if(rs.next())
{
out.println("Authorized person");
}
else
{
out.println("UnAuthorized person");
}
con.close();
}
catch(Exception e){out.println(""+e);}
%>
</body>
</html>
OUTPUT:
Experiment 12:
Create a simple visual bean with a area filled with a color. The shape of the area depends on the property
shape. If it is set to true then the shape of the area is Square and it is Circle, if it is false. The color of the
area should be changed dynamically for every mouse click.

Create a New Bean


Here are the steps that you must follow to create a new Bean:
1. Create a directory for the new Bean.
2. Create the Java source file(s).
3. Compile the source file(s).
4. Create a manifest file.
5. Generate a JAR file.
6. Start the BDK.
7. Test.

Create a Directory for the New Bean


You need to make a directory for the Bean. To follow along with this example, create z:\WtLab\week6.
Then change to that directory.
Create the Source File for the New Bean
The source code for the Colors component is shown in the following listing. It is located in the file
Colors.java.

The color of the component is determined by the private Color variable color, and its shape is
determined by the private boolean variable rectangular.
The constructor defines an anonymous inner class that extends MouseAdapter and overrides its
mousePressed( ) method. The change( ) method is invoked in response to mouse presses. The component is
initialized to a rectangular shape of 200 by 100 pixels. The change( ) method is invoked to select a random
color and repaint the component.
The getRectangular( ) and setRectangular( ) methods provide access to the one property of this Bean. The
change( ) method calls randomColor( ) to choose a color and then calls repaint( ) to make the change visible.
Notice that the paint( ) method uses the rectangular and color variables to determine how to present the Bean.

Compile the Source Code for the New Bean


Compile the source code to create a class file. Type the following: javac Colors.java.
Create a Manifest File
You must now create a manifest file. First, switch to the z:\WtLab\week7 directory. This is the
directory in which the manifest files for the BDK demos are located. Put the source code for your manifest
file in the file colors.mft. It is shown here:
Name: Colors.class
Java-Bean: True

This file indicates that there is one .class file in the JAR file and that it is a Java Bean.

Generate a JAR File


Beans are included in the ToolBox window of the BDK only if they are in JAR files in the directory z:\
WtLab\week7. These files are generated with the jar utility. Enter the following: jar cfm Colors.jar
Colors.mft *.class
This command creates the file colors.jar and places it in the directory z:\WtLab\week7
Start the BDK
Change to the directory BDK and run run.bat. This causes the BDK to start.
You should see three windows, titled ToolBox, BeanBox, and Properties. The ToolBox window
should include an entry labeled "Colors" for your new Bean.
Create an Instance of the Colors Bean
After you complete the preceding steps, create an instance of the Colors Bean in the BeanBox window. Test
your new component by pressing the mouse anywhere within its borders. Its color immediately changes. Use
the Properties window to change the rectangular property from false to true. Its shape immediately changes.

Colors.java

import java.awt.*;
import java.awt.event.*;
public class Colors extends Canvas {
transient private Color color;
private boolean rectangular;
public Colors() {
addMouseListener(new MouseAdapter() {
public void mousePressed(MouseEvent me) {
change();
}
});
rectangular = false;
setSize(200, 100);
change();
}
public boolean getRectangular() {
return rectangular;
}
public void setRectangular(boolean flag) {
this.rectangular = flag; repaint();
}
public void change() {
color = randomColor();
repaint();
}
private Color randomColor() {
int r = (int)(255*Math.random());
int g = (int)(255*Math.random());
int b = (int)(255*Math.random());
return new Color(r, g, b);
}
public void paint(Graphics g) {
Dimension d = getSize();
int h = d.height;
int w = d.width;
g.setColor(color);
if(rectangular) {
g.fillRect(0, 0, w-1, h-1);
}
else {
g.fillOval(0, 0, w-1, h-1);
}
}
}

Colors.mft
Name: Colors.class Java-Bean:
True
Creation of jar file:
Z:\ jar cfm Colors.jar Colors.mft *.class Now the jar
file is created .

Execution procedure
1. Write the source program in the notepad and save it as Colors.java
2. Complile the java file as follows javac Colors.java
now two .class files are created
3. create the manifest file with the following code Name: Colors.class
Java-Bean: true Save it as Colors.mft
4. create the jar file for by the following syntax Z:\ jar cfm Colors.jar Colors.mft *.class

5. now the jar file is created so we can open the bdk/beanbox/run.bat in that we go
to the file menu in that select the loadjar...
then load the jar file .. it can be shown in the tools box..
now we can select the Colors bean and place it on the bean box...
6. we click the ovel it can change the colors.. and click the rectangular is true then it changes to
the rectangle.....
Output

Experiment 13:
Validate the registration, user login, user profile and payment by credit card pages using JavaScript.

Validation.js
function form1_validation()
{
//Username Validation if(f1.username.value=="")
{
alert("You must enter a User Name"); f1.username.focus();
return false;
}
if(f1.username.value.length<3)
{
alert("User Name must consist of atleast 3 character"); f1.username.focus();
return false;
}
var checkStr=f1.username.value; for(i=0;i<checkStr.length;i++)
if(!(checkStr.charCodeAt(i)>=65&&checkStr.charCodeAt(i)<=91)
&& !(checkStr.charCodeAt(i)>=97 && checkStr.charCodeAt(i)<=122))
{
alert("Please enter valid User Name"); f1.username.focus();
return false;
}
//Password Validation if(f1.password.value.length<6)
{
alert("Please enter Password not less than 6"); f1.password.focus();
return false;
}
if(!(f1.password.value==f1.password1.value))
{
alert("Please re-enter corrert Password"); f1.password1.focus();
return false;
}
//email validation
flag=true; if(f1.email.value=="") flag=false;
var Str=f1.email.value; if(allValidChars(Str)) for(i=0;i<Str.length;i++) if(Str.charAt(i)=="@")
{
if((Str.substr(i+1,9)=="yahoo.com")||(Str.substr(i+1,9)=="gmail.com"))
{
flag=true; break;
}
}
else flag=false; if(!(flag))
{
alert("Please enter a valid Email ID"); f1.email.focus();
return false;
}
//phone number validation flag=true; if(f1.phno.value.length!=10) flag=false;
var phno=f1.phno.value; for(i=0;i<phno.length;i++)
if(!(phno.charCodeAt(i)>=48&&phno.charCodeAt(i)<=57)) flag=false;
if(!flag)
{
alert("Please enter valid Phone Number"); f1.phno.focus();
return false;
}
//gender validation flag=false; for(i=0;i<f1.radio.length;i++) if(f1.radio[i].checked)
flag=true; if(!(flag))
{
alert("Please choose a Gender"); return false;
}
//Date of birth validation if((f1.dd.selectedIndex<=0)||(f1.mm.selectedIndex<=0)||(f1.yyyy.selectedIndex<=0))
{
alert("Please choose a Date of Birth"); f1.phno.focus();
return false;
}
//checkbox validation flag=false;
for (i = 0; i < f1.checkbox.length; i++)
{
if (f1.checkbox[i].checked) flag = true;
}
if(!(flag))
{
alert("Please select at least one of the \"Language\" options."); return false;
}
//address validation if(f1.address.value.length<25)
{
alert("Please enter a Correct Address"); return false;
}
}
function allValidChars(email)
{
var validchars = "[email protected]_"; for (i=0; i < email.length; i++)
{
var letter = email.charAt(i).toLowerCase(); if (validchars.indexOf(letter) == -1)
return false;
}
return true;
}
Login.html
<html>
<head>
<title> Welcome to AMAZON website</title>
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="validation.js"></script>
</head>
<body >
<center>
<h3> Enter Login Details</h3>
<br/>
<form name="f1" onsubmit="return form1_validation()">
<table align="left" >
<tr> <td> User ID</td>
<td> <input type="text" name="username"></td> </tr>
<tr> <td> Password</td>
<td> <input type="password" name="password"></td> </tr>
<tr>
<td><input type="submit" value="Submit"></td>
<td><input type="reset" value="Reset"></td> </tr>
<tr> <td colspan=2>Forgot my User ID or Password</td>
</tr>
</table>
</html>
Experiment no. 14
MySQLi connectivity, INSERT, SELECT, DELETE with PHP

AIM: MySQLi connectivity, INSERT, SELECT, DELETE with PHP

OBJECTIVE: To learn Mysql database connectivity using PHP and performing operations using PHP.

TOOLS REQUIRED: PHP, Mysql and web browser.

THEORY:

After a database and a table have been created, we can start

adding data in them. Here are some syntax rules to follow:

 The SQL query must be quoted in PHP


 String values inside the SQL query must be quoted
 Numeric values must not be quoted
 The word NULL must not be quoted

The INSERT INTO statement is used to add new records to a

MySQL table: INSERT INTO table_name (column1, column2,

column3,...)
VALUES (value1, value2, value3,...)
Select Data From a MySQL Database

The SELECT statement is used to select data from one or more tables:

SELECT column_name(s) FROM table_name


or we can use the * character to select ALL columns from

a table: SELECT * FROM table_name

Delete Data From a MySQL Table Using MySQLi and PDO

The DELETE statement is used to delete records from a table:

DELETE FROM table_name WHERE some_column = some_value

PROGRAM:

The following examples add a new record to the "MyGuests" table:


<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}

$sql = "INSERT INTO MyGuests (firstname,


lastname, email) VALUES ('John', 'Doe',
'[email protected]')";

if ($conn->query($sql) === TRUE) {


echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();
?>

The following example selects the id, firstname and lastname columns from the MyGuests table and displays it on
the page:

<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}

$sql = "SELECT id, firstname, lastname FROM MyGuests";


$result = $conn->query($sql);

if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
echo "id: " . $row["id"]. " - Name: " . $row["firstname"]. " " . $row["lastname"]. "<br>";
}
} else {
echo "0 results";
}
$conn->close();
?>
OUTPUT:

id: 1 - Name: John Doe

id: 2 - Name: Mary Moe

id: 3 - Name: Julie Dooley


The following examples delete the record with id=3 in the "MyGuests"

table:

<?php

$servername = "localhost";

$username = "username";

$password = "password";

$dbname = "myDB";

// Create connection

$conn = new mysqli($servername, $username, $password,

$dbname);

// Check connection

if ($conn->connect_error) {

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

// sql to delete a record

$sql = "DELETE FROM MyGuests WHERE id=3";

if ($conn->query($sql) === TRUE) { echo "Record deleted

successfully";

} else {

echo "Error deleting record: " . $conn->error;

$conn->close();

?>

After the record is deleted, the table will look like this:
Id firstname lastname email reg_date

1 John Doe [email protected] 2014-10-22 14:26:15


2 Mary Moe [email protected] 2014-10-23
10:22:30

You might also like