WT Lab Manual For Cse

WT LAB
SARADA INSTITUTE OF TECNOLOGY & SCIENCE

SARADA NAGAR, RAGHUNADHAPALEM, KHAMMAM
WEB TECHNOLOGIES LAB MANUAL

FOR
IV YEAR I SEM B.Tech (C.S.E)
Department of Computer Science & Engineering
SARADA INSTITUTE OF TECHNOLOGY & SCIENCE
WT LAB
WEB TECHNOLOGIES LAB
Objective : To create a fully functional website with mvc architecture. To Develop an online Book store using we can sell books (Ex amazon .com). Hardware and Software required : 1. A working computer system with either Windows or Linux 2. A web browser either IE or firefox 3. Tomcat web server and Apache web server 4. XML editor like Altova Xml-spy [www.Altova.com/XMLSpy free ] , Stylusstudio , etc., 5. A database either Mysql or Oracle 6. JVM(Java virtual machine) must be installed on your system 7. BDK(Bean development kit) must be also be installed
Week-1: Design the following static web pages required for an online book store web site. 1) HOME PAGE: The static home page must contain three frames. Top frame : Logo and the college name and links to Home page, Login page, Registration page, Catalogue page and Cart page (the description of these pages will be given below). Left frame : At least four links for navigation, which will display the catalogue of respective links. For e.g.: When you click the link CSE the catalogue for CSE Books should be displayed in the Right frame. Right frame: The pages to the links in the left frame must be loaded here. Initially this page contains description of the web site.
Web Site Name Logo Home CSE ECE EEE CIVIL Login Registration Catalogue Cart
Description of the Web Site
Fig 1.1
2) LOGIN PAGE: This page looks like below:
WT LAB
Web Site Name Logo Home CSE ECE EEE CIVIL Login Registration Catalogue Cart
Login : Password:
Submit
Reset
3) CATOLOGUE PAGE: The catalogue page should contain the details of all the books available in the web site in a table. The details should contain the following: 1. 2. 3. 4. 5. Snap shot of Cover Page. Author Name. Publisher. Price. Add to cart button.
Web Site Name Logo Home CSE ECE EEE CIVIL Book : AI Author : S.Russel Publication : Princeton hall Book : Java 2 Author : Watson Publication : BPB publications Book : HTML in 24 hours Author : Sam Peter Publication : Sam publication $ 63 Login Registration Book : XML Bible Author : Winston Publication : Wiely Catalogue Cart
$ 40.5
$ 35.5
$ 50
Note: Week 2 contains the remaining pages and their description.
WT LAB
Week-2: 4) CART PAGE: The cart page contains the details about the books which are added to the cart. The cart page should look like this: Web Site Name Logo Home CSE ECE EEE CIVIL Login Book name Java 2 XML bible Registration Price $35.5 $40.5 Quantity 2 1 Total amount Catalogue Amount $70 $40.5 $130.5 Cart
5) REGISTRATION PAGE: Create a registration form with the following fields 1) Name (Text field) 2) Password (password field) 3) E-mail id (text field) 4) Phone number (text field) 5) Sex (radio button) 6) Date of birth (3 select boxes) 7) Languages known (check boxes English, Telugu, Hindi, Tamil) 8) Address (text area) WEEK 3: VALIDATION: Write JavaScript to validate the following fields of the above registration page. Name (Name should contains alphabets and the length should not be less than 6 characters). Password (Password should not be less than 6 characters length). E-mail id (should not contain any invalid and must follow the standard pattern name@domain.com) 4. Phone number (Phone number should contain 10 digits only). Note : You can also validate the login page with these parameters. Week-4: Design a web page using CSS (Cascading Style Sheets) which includes the following: 1) Use different font, styles: In the style definition you define how each selector should work (font, color etc.). Then, in the body of your pages, you refer to these selectors to activate the styles. For example: <HTML> <HEAD> <style type="text/css"> B.headline {color:red; font-size:22px; font-family:arial; text-decoration:underline} 1. 2. 3.
WT LAB
</style> </HEAD> <BODY> <b>This is normal bold</b><br> Selector {cursor:value} For example: <html> <head> <style type="text/css"> .xlink {cursor:crosshair} .hlink{cursor:help} </style> </head> <body> <b> <a href="mypage.htm" class="xlink">CROSS LINK</a> <br> <a href="mypage.htm" class="hlink">HELP LINK</a> </b> </body> </html> <b class="headline">This is headline style bold</b> </BODY> </HTML>
2) Set a background image for both the page and single elements on the page. You can define the background image for the page like this: BODY {background-image:url(myimage.gif);}
3) Control the repetition of the image with the background-repeat property. As background-repeat: repeat Tiles the image until the entire page is filled, just like an ordinary background image in plain HTML. 4) Define styles for links as A:link A:visited A:active A:hover Example: <style type="text/css"> A:link {text-decoration: none} A:visited {text-decoration: none} A:active {text-decoration: none} A:hover {text-decoration: underline; color: red;} </style> 5) Work with layers: For example: LAYER 1 ON TOP: <div style="position:relative; font-size:50px; z-index:2;">LAYER 1</div> <div style="position:relative; top:-50; left:5; color:red; font-size:80px; zindex:1">LAYER 2</div>
WT LAB
LAYER 2 ON TOP: <div style="position:relative; font-size:50px; z-index:3;">LAYER 1</div> <div style="position:relative; top:-50; left:5; color:red; font-size:80px; zindex:4">LAYER 2</div> 6) Add a customized cursor: Selector {cursor:value} For example: <html> <head> <style type="text/css"> .xlink {cursor:crosshair} .hlink{cursor:help} </style> </head> <body> <b> <a href="mypage.htm" class="xlink">CROSS LINK</a> <br> <a href="mypage.htm" class="hlink">HELP LINK</a> </b> </body> </html>
Week-5: Write an XML file which will display the Book information which includes the following: 1) Title of the book 2) Author Name 3) ISBN number 4) Publisher name 5) Edition 6) Price Write a Document Type Definition (DTD) to validate the above XML file. Display the XML file as follows. The contents should be displayed in a table. The header of the table should be in color GREY. And the Author names column should be displayed in one color and should be capitalized and in bold. Use your own colors for remaining columns. Use XML schemas XSL and CSS for the above purpose. Note: Give at least for 4 books. It should be valid syntactically. Hint: You can use some xml editors like XML-spy Week-6: VISUAL BEANS: 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. The color should also be changed if we change the color in the property window . Week-7: 1) Install TOMCAT web server and APACHE. While installation assign port number 4040 to TOMCAT and 8080 to APACHE. Make sure that these ports are available i.e., no other process is using this port. 2) Access the above developed static web pages for books web site, using these servers by putting the web pages developed in week-1 and week-2 in the document root. Access the pages by using the urls : http://localhost:4040/rama/books.html (for tomcat) http://localhost:8080/books.html (for Apache)
Week-8:
WT LAB
User Authentication : Assume four users user1,user2,user3 and user4 having the passwords pwd1,pwd2,pwd3 and pwd4 respectively. Write a servelet for doing the following. 1. Create a Cookie and add these four user ids and passwords to this Cookie. 2. Read the user id and passwords entered in the Login form (week1) and authenticate with the values (user id and passwords ) available in the cookies. If he is a valid user(i.e., user-name and password match) you should welcome him by name(user-name) else you should display You are not an authenticated user . Use init-parameters to do this. Store the user-names and passwords in the webinf.xml and access them in the servlet by using the getInitParameters() method. Week-9: 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 web site, whenever a new user clicks the submit button in the registration page (week2). Week-10: 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 ( similar to week8 instead of cookies). Week-11: Create tables in the database which contain the details of items (books in our case like Book name , Price, Quantity, Amount )) of each category. Modify your catalogue page (week 2)in such a way that you should connect to the database and extract data from the tables and display them in the catalogue page using JDBC. Week-12: HTTP is a stateless protocol. Session is required to maintain the state. The user may add some items to cart from the catalog page. He can check the cart page for the selected items. He may visit the catalogue again and select some more items. Here our interest is the selected items should be added to the old cart rather than a new cart. Multiple users can do the same thing at a time(i.e., from different systems in the LAN using the ip-address instead of localhost). This can be achieved through the use of sessions. Every user will have his own session which will be created after his successful login to the website. When the user logs out his session should get invalidated (by using the method session.invalidate() ). Modify your catalogue and cart JSP pages to achieve the above mentioned functionality using sessions.
WT LAB
AIM:
Develop static pages (using only HTML) of an online Book store. The pages should resemble :www.amazon.com. The website should consist the following pages.
Home page Registration and user Login User profile page Books catalog Shopping cart Payment by credit cardOrder Conformation
PROCEDURE: Home page

Main.html:
<html> <head> <title> Amazon</title> </head> <body bgcolor="cyan"> <center> <strong><h1>Welcome to AMAZON</h1></strong> <form method="post" action="login.html" target=_blank > <h4>for books</h4><input type="submit" value="click here"> </form> </center> </body> </html>
WT LAB
Registration and user Login Login.html:

<html> <head> <title> login page</title> </head> <body bgcolor="cyan"> <center> <strong><h1> AMAZON </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" >    <input type="reset" value="reset"></form></td> </tr> </table> </body> </html>
WT LAB
10
User profile page

Userpro.html:
<html> <head> <title> login page</title> </head> <body bgcolor="cyan"> <center><strong><h1> AMAZON </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    <option > <input type="radio" name="sex" id="male"></td> <td><h4>female <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>
WT LAB
11
Books catalog
Catalog.html:
<html> <head> <title> books catalog</title> </head> <body bgcolor="cyan"> <center><h1>AMAZON</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>
WT LAB <b>for buy one of these books <br> </b><input type="submit" value="click here"> </center> </form> </body> </html>
12
WT LAB
13
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>
WT LAB
14
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>AMAZON</h1> <pre><strong> <b>Your order Is Conformed </strong></pre> <h2><b>THANK YOU</h2> </center> </body></html>
WT LAB
15
Result: Home page:
WT LAB
16
Registration and user Login:
WT LAB
17
User profile page:
WT LAB
18
Books catalog:
WT LAB
19
Shopping cart:
WT LAB
20
Payment by credit card:
WT LAB
21
Order Conformation:
WT LAB
22
AIM:
Validate the Registration, user login, user profile and payment by credit card pages using JavaScript. PROCEDURE:
Home page:
Main.html:
<frameset rows=25%, 75 %> <frame src=top.html name=top> <frameset cols=25%,75%> <frame src=left.html name=left> <frame src=right.html name=right> </frameset> </frameset>
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 bgcolor=pink> <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:
WT LAB
23
<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><fontcolor=black> USER PROFILE</font></a></li><br><br> <li><a href=catalog.html target=right><fontcolor=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><fontcolor=black> PAYMENT</font></a></li><br><br> <li><a href=order.html target=right><font color=black> ORDER CONFIRMATION</font></a></li><br><br> </ul> </body> </html>
WT LAB
24
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=="") { flag=0; } if(flag==1) { alert("VALID INPUT"); } 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"></pre><br><br> </div> <br><br> <div align="center"> <input type="submit" value="ok" onClick="validate()">     <input type="reset" value="clear" > </form> </body> </html>
WT LAB
25
User profile page

Profile.html:
<html> <body bgcolor=pink><br><br> <script language=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==) { flag=0; } var str=document.myform.phno.value; var x; for(var i=0;i<str.length;i++) { x=str.substr(i,1) if(!(x<=9)) { flag=0; break; } } if(flag==1) { alert("VALID INPUT"); } 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:<iput type="text" name="phno"><br> LOGINID :<input type="text" name="id"><br> PASSWORD :<input type="password" name="pwd"></pre><br><br> </div>
WT LAB <br><br> <div align="center"> <input type="submit" value="ok" onClick="validate()">    <input type="reset" value="clear"> </form></body></html>
26
WT LAB
27
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") { document.writeln("<body bgcolor=pink>"); document.writeln("title-->c"+" cost-->444"); } else if(str=="jsp") { document.writeln("<body bgcolor=pink>"); document.writeln("title-->jsp"+" cost-->555"); } else { flag=0; } if(flag==1) { alert("VALID INPUT"); } else { alert("INVALID INPUT"); document.myform.focus(); } } </script> <form name="myform" > <div align="center"><pre> BOOK TITLE :<input type="text" name="title"><br> </pre><br><br> </div>
WT LAB <br><br> <div align="center"> <input type="submit" value="ok" onClick="validate()">     <input type="reset" value="clear"> </form> </body> </html>
28
WT LAB
29
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==""|| document.myform.date.value=="") { flag=0; } var str=document.myform.no.value; var x; for(var i=0;i<str.length;i++) { x=str.substr(i,1) if(!(x<=9)) { flag=0; break; } } 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" > <div align="center"><pre>
WT LAB 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> DATE :<input type="text" name="date"><br></pre><br><br> </div> <br><br> <div align="center"> <input type="submit" value="ok" onClick="validate()">      <input type="reset" value="clear"> </form> </body> </html>
30
WT LAB
31
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; for(var i=0;i<str.length;i++) { x=str.substr(i,1); if(!(x<=9)) { flag=0; break; } } str=document.myform.num.value; for(var i=0;i<str.lenght;i++) { x=str.substr(i,1); if(!(x<=9)) { flag=0; break; } } if(flag==1) { alert("VALID INPUT"); } else { alert("INVALID INPUT"); document.myform.focus();
WT LAB
32
} } </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="submit" value="ok" onClick="validate()">     <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>AMAZON</h1> <pre><strong> <b>Your order Is Conformed </strong></pre> <h2><b>THANK YOU</h2> </center> </body></html>
WT LAB
33
Result: Home page
WT LAB
34
Registration and user Login
WT LAB
35
User profile page
WT LAB
36
Books catalog
WT LAB
37
Shopping cart
WT LAB
38
Payment by credit card
WT LAB
39
Order Conformation
WT LAB
40
AIM:
Create and Save an XML document at the server, which contains 10 users information. Write program, which takes user ID as input and returns the user details by taking the user information from XML Document.
Procedure:
Login Page:
Login.html:
<html> <head> <script type="text/javascript"> function ser() { var xmldoc=new ActiveXObject("Microsoft.XMLDOM"); xmldoc.load("users.xml"); var id=f1.id.value; var pass=f1.pass.value; var x=xmldoc.getElementsByTagName("userid"); var y=xmldoc.getElementsByTagName("password"); for(i=0;i<x.length;i++) { if(x[i].childNodes[0].nodeValue==id) { if(y[i].childNodes[0].nodeValue==pass) { alert("successfull logged"); var ob=window.open("userinfo.html","_blank"); ob.document.f1.uid.value=x[i].childNodes[0].nodeValue; xmldoc.load("userinfo.xml"); var x0=xmldoc.getElementsByTagName("userid"); var x1=xmldoc.getElementsByTagName("username"); var x2=xmldoc.getElementsByTagName("qualification"); var x3=xmldoc.getElementsByTagName("job"); var x4=xmldoc.getElementsByTagName("companyname"); var x5=xmldoc.getElementsByTagName("dob"); var x6=xmldoc.getElementsByTagName("street"); var x7=xmldoc.getElementsByTagName("city"); for(var j=0;j<x0.length;j++) { if(x0[j].childNodes[0].nodeValue==id) {
WT LAB
41 ob.document.f1.uname.value=x1[j].childNodes[0].nodeValue; ob.document.f1.qual.value=x2[j].childNodes[0].nodeValue; ob.document.f1.jn.value=x3[j].childNodes[0].nodeValue; ob.document.f1.cn.value=x4[j].childNodes[0].nodeValue; ob.document.f1.dob.value=x5[j].childNodes[0].nodeValue; ob.document.f1.address.value=x6[j].childNodes[0].nodeVa lue+","+x7[j].childNodes[0].nodeValue; } } } else alert("incorrect password"); return; }
} alert("incorrect userid") ; } </script> </head> <body> <form name="f1"> <center> <h1>Login Form</h1> <br><B>User Id:   <input type="text" name="id"> <br><br>Password:</B><input type ="password" name="pass"> <br><br> <input type="button" value="submit" onClick="ser()"> </center> </form> </body> </html>
WT LAB
42
User information page:

Userinfo.html:
<html> <head> <title>User Info</title> </head> <body> <center> <h1>User Information</h1> <form name="f1"> <pre> <B> User Id: <input type="text" name="uid" onblur="fun()"> User Name: <input type="text" name="uname"> Qualification: <input type="text" name="qual"> Job: <input type="text" name="jn"> Company: <input type="text" name="cn"> Date Of Birth: <input type="text" name="dob"> Address: <textarea name="address" rows=5 cols=19> </textarea> </B> </pre> </form> </center> </body> </html>
WT LAB
43
Users xml pages:

Users.xml:
<?xml version="1.0" encoding="UTF-8"?> <users> <user> <userid>1</userid> <password>a</password> </user> <user> <userid>2</userid> <password>b</password> </user> <user> <userid>3</userid> <password>c</password> </user> <user> <userid>4</userid> <password>d</password> </user> <user> <userid>5</userid> <password>e</password> </user> <user> <userid>6</userid> <password>f</password> </user> </users>
WT LAB
44
Userinfo.xml:
<?xml version="1.0" encoding="UTF-8"?> <userinfo> <user> <userid>1</userid> <username>abc</username> <qualification>def</qualification> <job>ghi</job> <companyname>jkl</companyname> <dob>may06,88</dob> <address> <street>mno</street> <city>pqr</city> </address> </user> <user> <userid>2</userid> <username>def</username> <qualification>ghi</qualification> <job>jkl</job> <companyname>mno</companyname> <dob>june24,88</dob> <address> <street>pqr</street> <city>stu</city> </address> </user> <user> <userid>3</userid> <username>ghi</username> <qualification>jkl</qualification> <job>mno</job> <companyname>pqr</companyname> <dob>may07,86</dob> <address> <street>stu</street> <city>vwx</city> </address> </user> <user> <userid>4</userid> <username>jkl</username> <qualification>mno</qualification> <job>pqr</job> <companyname>stu</companyname> <dob>sep6,88</dob> <address>
WT LAB <street>vwx</street> <city>yz</city> </address> </user> <user> <userid>5</userid> <username>mno</username> <qualification>pqr</qualification> <job>stu</job> <companyname>vwx</companyname> <dob>aug23,87</dob> <address> <street>yz</street> <city>abc</city> </address> </user> <user> <userid>6</userid> <username>pqr</username> <qualification>stu</qualification> <job>vwx</job> <companyname>yz</companyname> <dob>oct22,88</dob> <address> <street>abc</street> <city>def</city> </address> </user> </userinfo>
45
WT LAB
46
Output: Login page:
WT LAB
47
User information page:
WT LAB
48
AIM:
Install TOMCAT web server. Convert the static webpages of assignments 2 into dynamic webpages using servlets and cookies. Hint: Users information (user id, password) would be stored in web.xml.
PROCEDURE:
First install the tomcat into the system. Then make a subdirectly(eg., tr) in the \tomcat\webapps. Under tr create WEB-INF directory and also place the html files in this tr directory only. Next under WEB-INF create two subclasses lib,classes and web.xml Next place all the class files under the classes and jar files(servlet-api.jar,classes12.jar etc) under lib subdirectories. After this start tomcat by giving the following command at the instll_dir>tomcat>bin Catalina.bat run At the I.E(web browser) give the url as http;//localhost:8080//tr/htmlfile or servlet url pattern Portno 8080 is assigned for the tomcat.
Web.xml:
<?xml version="1.0" encoding="UTF-8"?> <web-app> <servlet> <servlet-name>Servlet</servlet-name> <servlet-class>Servlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>Servlet</servlet-name> <url-pattern>/Servlet</url-pattern> </servlet-mapping> </web-app>
WT LAB
49
Login.html:
<html> <head> <title>Login</title> </head> <body> <form method="post" action="/ss/Servlet"> <table> <tr> <td> User Name </td> <td> <input type="text" name="usrname"> </td> </tr> <tr> <td> Password </td> <td> <input type="password" name="passwd"> </td> </tr> </table> <input type="submit" value="Submit"> <input type="reset" value="Clear"> </form> </body> </html>
WT LAB
50
Servlet.java:
import java.io.*; import java.util.*; import javax.servlet.*; import javax.servlet.http.*;
public class Servlet extends HttpServlet { public void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { PrintWriter pw=response.getWriter(); if(request.getParameter("username").equals("cserocks") && request.getParameter("passwd").equals("sivani")) pw.println(request.getParameter("username")+" login successful"); else pw.println("login Unsuccessful"); }
WT LAB
51
Result:
WT LAB
52
WT LAB
53
AIM:
Create and Save an XML document at the server, which contains 10 users information. Write program, which takes user ID as input and returns the user details by taking the user information from XML Document.
Procedure:
Std.html:
<html> <head> <script> function LoadXmlDoc(dname) { xmldoc=new ActiveXObject("Microsoft.XMLDOM"); xmldoc.async="false"; xmldoc.load(dname); return xmldoc; } function validate() { var i,k,j=0; xmldoc=LoadXmlDoc("student.xml"); var v1=myform.n2.value; if(v1.length==0) window.alert("enter the roll no."); else { v1=parseInt(v1); arr=xmldoc.getElementsByTagName("students"); for(i=0;i<arr.length;i++) { var txt=xmldoc.getElementsByTagName("rollno")[i].childNodes[0].nodeValue; if(txt==v1) {k=i; j=1; } } if(j==1) { nam=xmldoc.getElementsByTagName("name")[k].childNodes[0].nodeValue; rol=xmldoc.getElementsByTagName("rollno")[k].childNodes[0].nodeValue; per=xmldoc.getElementsByTagName("percentage")[k].childNodes[0].nodeValue; document.write("<body bgcolor='pink'>");
Login Page:
WT LAB
54
document.write("<table border=1 align='center'><tr><th colspan='2'>USER DETAILS</th></tr>"); document.write("<tr><th>Name::</th><td>"+nam+"</td></tr>"); document.write("<tr><th>RollNumber::</th><td>"+rol+"</td></tr>"); document.write("<tr><th>Percentage::</th><td>"+per+"</td></tr>"); document.write("</table></body>"); } else window.alert("roll number not found"); } } </script> </head> <body bgcolor="pink" text="red"> <form name="myform"> <table align="center"> <tr><td><B>RollNumber</B></td><td><input type="text" size=15 name="n2"></td></tr> </table> <br> <center><input type=submit value="submit" name="b1" onClick="validate()"></center> </form> </body> </html>
WT LAB
55
Student XML Document: Student.xml:

<?xml version="1.0" ?> <cse> <students> <rollno>501</rollno> <name>ABC</name> <percentage>65%</percentage> </students> <students> <rollno>502</rollno> <name>DEF</name> <percentage>67%</percentage> </students> <students> <rollno>503</rollno> <name>GHI</name> <percentage>69%</percentage> </students> <students> <rollno>504</rollno> <name>JKL</name> <percentage>65%</percentage> </students> <students> <rollno>505</rollno> <name>MNO</name> <percentage>73%</percentage> </students> <students> <rollno>506</rollno> <name>PQR</name> <percentage>74%</percentage> </students> <students> <rollno>507</rollno> <name>stu</name> <percentage>65%</percentage> </students> <students>
WT LAB <rollno>508</rollno> <name>VWX</name> <percentage>70%</percentage> </students> <students> <rollno>509</rollno> <name>YZ</name> <percentage>72%</percentage> </students> <students> <rollno>510</rollno> <name>PQR</name> <percentage>75%</percentage> </students> </cse>
56
WT LAB
57
Output: Login page:
WT LAB
58
Result page:
WT LAB
59
AIM:
Install TOMCAT web server. Convert the static webpages of assignments 2 into dynamic webpages using servlets and cookies. Hint: Users information (user id, password, credit card number) would be stored in web.xml. Each user should have a separate Shopping Cart.
PROCEDURE:
First install the tomcat into the system. Then make a subdirectly(eg., tr) in the \tomcat\webapps. Under tr create WEB-INF directory and also place the html files in this tr directory only. Next under WEB-INF create two subclasses lib,classes and web.xml Next place all the class files under the classes and jar files(servlet-api.jar,classes12.jar etc) under lib subdirectories. After this start tomcat by giving the following command at the instll_dir>tomcat>bin Catalina.bat run At the I.E(web browser) give the url as http;//localhost:8080//tr/htmlfile or servlet url pattern Portno 8080 is assigned for the tomcat.
Home page:
Main.html:
<html> <body> <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="login.html">LOGIN</a> <a href="reg.html"> REGISTRATION</a></div></pre> </body> </html>
WT LAB
60
Login page:
Login.html:
<html> <body><br /><br /><br /> <form name="myform" method="post" action="login"> <div align="center"><pre> LOGIN ID :<input type="text" name="id" /><br /> PASSWORD :<input type="password" name="pwd" /></pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
WT LAB
61
Registration page:
Reg.html:
<html> <body><br /><br /> <form name="myform" method="post" action="reg"> <table align="center" > <tr> <td>NAME</td> <td>:<input type="text" name="name" /></td> </tr> <tr> <td>ADDRESS</td> <td>:<input type="text" name="addr" /></td> </tr> <tr> <td>CONTACT NUMBER</td> <td>:<input type="text" name="phno" /></td> </tr> <tr> <td>LOGINID</td> <td>:<input type="text" name="id" /></td> </tr> <tr> <td>PASSWORD</td> <td>:<input type="password" name="pwd" /></td> </tr> </table> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
WT LAB
62
User profile page:

Profile.html:
<html> <body><br /><br /><br /> <form name="myform" method="post" action="profile"> <div align="center"><pre> LOGIN ID :<input type="text" name="id" /><br /> </pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
Books catalog page:

Catalog.html:
<html> <body><br /><br /><br /> <form method="post" action="catalog"> <div align="center"><pre> BOOK TITLE :<input type="text" name="title" /><br /> </pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" name="button1"/>       <input type="reset" value="clear" name="button2"/> </div> </form> </body> </html>
WT LAB
63
Shopping cart, Payment Conformation page:

Order.html:
by
credit
card,
Order
<html> <body><br /><br /> <form method="post" action="order"> <div align="center"><pre> 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"/>       <input type="reset" value="clear" name="button2"/> </div> </form> </body> </html>
WT LAB
64
Login servlet:
Login.java:
import java.sql.*; import java.io.*; 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>"); String id=req.getParameter("id"); String pwd=req.getParameter("pwd"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger "); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd from login"; ResultSet rs=stmt.executeQuery(sqlstmt); int flag=0; while(rs.next()) { if(id.equals(rs.getString(1))&&pwd.equals(rs.getString(2))) { flag=1; } } if(flag==0) { pw.println("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); pw.println("<a href=\"login.html\">press LOGIN to RETRY</a>"); } else { pw.println("<br><br>VALID LOGIN ID<br><br>"); pw.println("<h3><ul>");
WT LAB pw.println("<li><a href=\"profile.html\"><fontcolor=\"black\">USER PROFILE</font> </a></li><br><br>"); pw.println("<li><a href=\"catalog.html\"><fontcolor=\"black\">BOOKS CATALOG</font></a></li><br><br>"); pw.println("<li><a href=\"order.html\"><fontcolor=\"black\">ORDER CONFIRMATION</font> </a></li></ul><br><br>"); } pw.println("</body></html>"); } catch(Exception e) { resp.sendError(500,e.toString()); } } }
65
WT LAB
66
Registration servlet:
Reg.java:
import java.sql.*; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class reg extends HttpServlet { public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException { PrintWriter pw=resp.getWriter(); resp.setContentType("text/html"); pw.println("<html><body>"); String name=req.getParameter("name"); String addr=req.getParameter("addr"); String phno=req.getParameter("phno"); String id1=req.getParameter("id"); String pwd1=req.getParameter("pwd"); int no=Integer.parseInt(phno); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger "); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd from login"; ResultSet rs=stmt.executeQuery(sqlstmt); int flag=0; while(rs.next()) { if(id1.equals(rs.getString(1))&&pwd1.equals(rs.getString(2))) { flag=1; } } if(flag==1) { pw.println("<br><br>SORRY INVALID ID ALREADY EXITS TRY AGAIN WITH NEW ID<br><br>"); pw.println("<a href=\"reg.html\">press REGISTER to RETRY</a>");
WT LAB } else {
67
Statement stmt1=con.createStatement(); stmt1.executeUpdate("insert into login values('"+name+"','"+addr+"',"+no+",'"+id1+"','"+pwd1+"') ;"); pw.println("<br><br>YOUR DETAILS ARE ENTERED<br><br>"); pw.println("<a href=\"login.html\">press LOGIN to login</a>"); } pw.println("</body></html>"); } catch(Exception e) { resp.sendError(500,e.toString()); } } }
WT LAB
68
Profile servlet:
Profile.java:
import java.sql.*; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class profile extends HttpServlet { public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException { PrintWriter pw=resp.getWriter(); pw.println("<html><body>"); String id=req.getParameter("id"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc: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("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); pw.println("<a href=\"profile.html\">press HERE to RETRY</a>"); } pw.println("</body></html>"); } catch(Exception e) { resp.sendError(500,e.toString());
WT LAB } } }
69
WT LAB
70
Catalog servlet:
Catalog.java:
import java.sql.*; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class catalog extends HttpServlet { public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException { PrintWriter pw=resp.getWriter(); pw.println("<html><body>"); String title=req.getParameter("title"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc: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()) { 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("<br><br>SORRY INVALID TITLE TRY AGAIN <br><br>"); pw.println("<a href=\"catalog.html\">press HERE to RETRY</a>"); } pw.println("</body></html>"); } catch(Exception e)
WT LAB { resp.sendError(500,e.toString()); } } }
71
WT LAB
72
Order servlet:
Order.java:
import java.sql.*; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class order extends HttpServlet { public void service(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException { int count; PrintWriter pw=resp.getWriter(); pw.println("<html><body>"); String id=req.getParameter("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"); try { count=Integer.parseInt(count1); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger "); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd 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("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); pw.println("<a href= \" order.html \" >press HERE to RETRY</a>"); }
WT LAB else {
73
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("<br><br>AMOUNT :"+amount+"<br><br><br><br>"); Statement stmt1=con.createStatement(); stmt1.executeUpdate("insert into details values('"+id+"','"+title+"',"+amount+",'"+cno+"');"); pw.println("<br>YOUR ORDER has taken<br>"); } if(flag1==0) { pw.println("<br><br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); pw.println("<a href=\"order.html\">press HERE to RETRY</a>"); } } pw.println("</body></html>"); con.close(); } catch(Exception e) { resp.sendError(500,e.toString()); } } }
WT LAB
74
Web.xml:
<?xml version="1.0"?> <web-app > <servlet> <servlet-name>login</servlet-name> <servlet-class>login</servlet-class> </servlet> <servlet> <servlet-name>reg</servlet-name> <servlet-class>reg</servlet-class> </servlet> <servlet> <servlet-name>profile</servlet-name> <servlet-class>profile</servlet-class> </servlet> <servlet> <servlet-name>order</servlet-name> <servlet-class>order</servlet-class> </servlet> <servlet> <servlet-name>catalog</servlet-name> <servlet-class>catalog</servlet-class> </servlet> <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> <servlet-mapping> <servlet-name>profile</servlet-name> <url-pattern>/profile</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>order</servlet-name> <url-pattern>/order</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>catalog</servlet-name> <url-pattern>/catalog</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>main.html</welcome-file> </welcome-file-list> </web-app>
WT LAB
75
Output:
Home page:
WT LAB
76
Login page:
WT LAB
77
Login servlet:
WT LAB
78
Registration page:
WT LAB
79
Reg servlet:
WT LAB
80
User profile page:
WT LAB
81
Profile servlet:
WT LAB
82
Books catalog page:
WT LAB
83
Catalog servlet:
WT LAB
84
by
credit
card,
Order
WT LAB
85
Order servlet:
WT LAB
86
AIM:
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 and books information. The books catalogue should be dynamically loaded from the database. Follow the MVC architecture while doing the website.
PROCEDURE:
1) 2) 3) 4) Create your own directory under tomcat/webapps (e.g. tr1) Copy the html files in tr1 Copy the jsp files also into tr1 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
Home page:
Main.html:
<html> <body> <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="login.html">LOGIN</a> <a href="reg.html">REGISTRATION</a></div></pre> </body></html>
WT LAB
87
Login page:
Login.html:
<html> <body><br /><br /><br /> <form name="myform" method="post" action="login.jsp"> <div align="center"><pre> LOGIN ID :<input type="text" name="id" /><br /> PASSWORD :<input type="password" name="pwd" /></pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
WT LAB
88
Registration page:
Reg.html:
<html> <body><br /><br /> <form name="myform" method="post" action="reg.jsp"> <table align="center" > <tr> <td>NAME</td> <td>:<input type="text" name="name" /></td> </tr> <tr> <td>ADDRESS</td> <td>:<input type="text" name="addr" /></td> </tr> <tr> <td>CONTACT NUMBER</td> <td>:<input type="text" name="phno" /></td> </tr> <tr> <td>LOGINID</td> <td>:<input type="text" name="id" /></td> </tr> <tr> <td>PASSWORD</td> <td>:<input type="password" name="pwd" /></td> </tr> </table> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
WT LAB
89
User profile page:

Profile.html:
<html> <body><br /><br /><br /> <form name="myform" method="post" action="profile.jsp"> <div align="center"><pre> LOGIN ID :<input type="text" name="id" /><br /> </pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" onclick="validate()" />       <input type="reset" value="clear" /> </div> </form> </body> </html>
Books catalog page:

Catalog.html:
<html> <body><br /><br /><br /> <form method="post" action="catalog.jsp"> <div align="center"><pre> BOOK TITLE :<input type="text" name="title" /><br /> </pre><br /><br /> </div> <br /><br /> <div align="center"> <input type="submit" value="ok" name="button1"/>       <input type="reset" value="clear" name="button2"/> </div> </form> </body> </html>
WT LAB
90

Order.html:
<html>
by
credit
card,
Order
<body><br /><br /> <form method="post" action="order.jsp"> <div align="center"><pre> 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"/>       <input type="reset" value="clear" name="button2"/> </div> </form> </body> </html>
WT LAB
91
Login JSP:
Login.jsp:
<%@page import="java.sql.*"%> <%@page import="java.io.*"%> <% out.println("<html><body>"); String id=request.getParameter("id"); String pwd=request.getParameter("pwd"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger"); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd from login"; ResultSet rs=stmt.executeQuery(sqlstmt); int flag=0; while(rs.next()) { if(id.equals(rs.getString(1))&&pwd.equals(rs.getString(2))) { flag=1; } } if(flag==0) { out.println("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); out.println("<a href=\"login.html\">press LOGIN to RETRY</a>"); } else { out.println("<br><br>VALID LOGIN ID<br><br>"); out.println("<h3><ul>"); out.println("<li><a href=\"profile.html\"><fontcolor=\"black\">USER PROFILE</font> </a></li><br><br>"); out.println("<li><a href=\"catalog.html\"><fontcolor=\"black\">BOOKS CATALOG</font></a></li><br><br>"); out.println("<li><a href=\"order.html\"><fontcolor=\"black\">ORDER CONFIRMATION</font> </a></li></ul><br><br>"); } out.println("</body></html>"); con.close(); %>
WT LAB
92
Registration JSP:
Reg.jsp:
<%@page import="java.sql.*"%> <%@page import="java.io.*"%> <% response.setContentType("text/html"); out.println("<html><body>"); String name=request.getParameter("name"); String addr=request.getParameter("addr"); String phno=request.getParameter("phno"); String id1=request.getParameter("id"); String pwd1=request.getParameter("pwd"); int no=Integer.parseInt(phno); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger"); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd from login"; ResultSet rs=stmt.executeQuery(sqlstmt); int flag=0; while(rs.next()) { if(id1.equals(rs.getString(1))&&pwd1.equals(rs.getString(2))) { flag=1; } } if(flag==1) { out.println("<br><br>SORRY INVALID ID ALREADY EXITS TRY AGAIN WITH NEW ID<br><br>"); out.println("<a href=\"reg.html\">press REGISTER to RETRY</a>"); } else { Statement stmt1=con.createStatement(); stmt1.executeUpdate("insert into login values('"+name+"','"+addr+"',"+no+",'"+id1+"','"+pwd1+"');"); out.println("<br><br>YOUR DETAILS ARE ENTERED<br><br>"); out.println("<a href=\"login.html\">press LOGIN to login</a>"); } out.println("</body></html>"); con.close(); %>
WT LAB
93
Profile JSP:
Profile.jsp:
<%@page import="java.sql.*"%> <%@page import="java.io.*"%> <% out.println("<html><body>"); String id=request.getParameter("id"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger"); Statement stmt=con.createStatement(); String sqlstmt="select * from login where id="+id+""; ResultSet rs=stmt.executeQuery(sqlstmt); int flag=0; out.println("<br><br><br>"); 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("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); out.println("<a href=\"profile.html\">press HERE to RETRY</a>"); } out.println("</body></html>"); con.close(); %>
WT LAB
94
Catalog JSP:
Catalog.jsp:
<%@page import="java.sql.*"%> <%@page import="java.io.*"%> <% out.println("<html><body>"); String title=request.getParameter("title"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc: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("<br><br>SORRY INVALID TITLE TRY AGAIN <br><br>"); out.println("<a href=\"catalog.html\">press HERE to RETRY</a>"); } out.println("</body></html>"); con.close(); %>
WT LAB
95
Order servlet:
Order.java:
<%@page import="java.sql.*"%> <%@page import="java.io.*"%> <% int count; out.println("<html><body>"); 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"); count=Integer.parseInt(count1); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger"); Statement stmt=con.createStatement(); String sqlstmt="select id,pwd 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("<br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); out.println("<a href= \"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;
WT LAB
96 out.println("<br><br>AMOUNT :"+amount+"<br><br><br><br>"); Statement stmt1=con.createStatement(); stmt1.executeUpdate("insert into details values('"+id+"','"+title+"',"+amount+",'"+cno+"');"); out.println("<br>YOUR ORDER has taken<br>"); } if(flag1==0) { out.println("<br><br><br>SORRY INVALID ID TRY AGAIN ID<br><br>"); out.println("<a href=\"order.html\">press HERE to RETRY</a>"); } } out.println("</body></html>"); con.close();
%>
WT LAB
97
Output:
Home page:
WT LAB
98
Login page:
WT LAB
99
Login JSP:
WT LAB
100
Registration page:
WT LAB
101
Reg JSP:
WT LAB
102
User profile page:
WT LAB
103
Profile JSP:
WT LAB
104
Books catalog page:
WT LAB
105
Catalog JSP:
WT LAB
106
by
credit
card,
Order
WT LAB
107
Order JSP:

WT Lab Manual For Cse

Transféré par

Informations du document

Description originale:

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

WT Lab Manual For Cse

Transféré par

Droits d'auteur :

Formats disponibles

WT LAB

SARADA INSTITUTE OF TECNOLOGY & SCIENCE

WEB TECHNOLOGIES LAB MANUAL

IV YEAR I SEM B.Tech (C.S.E)

Department of Computer Science & Engineering

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

WEB TECHNOLOGIES LAB

Description of the Web Site

2) LOGIN PAGE: This page looks like below:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Note: Week 2 contains the remaining pages and their description.

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

PROCEDURE: Home page

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Registration and user Login Login.html:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

User profile page

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Shopping cart Shopping.html:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Payment by credit card Payment.html:

Order Conformation Ordrconform:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Result: Home page:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Registration and user Login:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

User profile page:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Payment by credit card:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Registration and user Login

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

User profile page

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Shopping cart: Catalog.html:

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Payment by credit card

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Result: Home page

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

Registration and user Login

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

User profile page

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE

SARADA INSTITUTE OF TECHNOLOGY & SCIENCE