(AN ISO 9001-2008 CERTIFIED INSTITUTION)

(Approved by AICTE, New Delhi & Affiliated to Anna University)

No.60, Avadi –Vel Tech Road, Chennai-600 062.

21HC67P- INTERNET PROGRAMMING LABORATORY

NAME : ……………………………………………

REGISTER NO : ……………………………………………

VH NO : ……………………………………………

BRANCH : ……………………………………………

YEAR : ……………………………………………
SEMESTER : ……………………………………………
 (AN ISO 9001-2008 CERTIFIED INSTITUTION)
(Approved by AICTE, New Delhi & Affiliated to Anna University)
No.60, Avadi – Vel Tech Road, Chennai-600 062.

BONAFIDE CERTIFICATE

Name…………………….…………………………….………….….………………….….…………………………………………………………….

Year: ………... Semester: …………………Branch: ……………………….VH NO……………………...

University Register No:

Certified that his/her is the bonafide record of work done by the above student in the

21HC67P- INTERNET PROGRAMMING LABORATORY during the academic year 2024-2025.

Signature of Lab In charge Signature of Head of the Department

Submitted for the University Practical Examination held on .................. at VEL TECH HIGH TECH Dr.
RANGARAJAN Dr. SAKUNTHALA ENGINEERING COLLEGE, No.60, AVADI–VELTECH
ROAD, AVADI, CHENNAI - 600062.

Signature of Examiners

Internal Examiner: …………………… External Examiner: ………………

Date: …………….…….
 (AN ISO 9001-2008 CERTIFIED INSTITUTION)
(Approved by AICTE, New Delhi & Affiliated to Anna University)
No.60, Avadi – Vel Tech Road, Chennai-600 062.
VISION
• Pursuit of excellence in technical education to create civic
responsibility with competency.
MISSION
• To impart the attributes of global engineers to face industrial challenges
with social relevance.
• To indoctrinate as front runners through moral practices.
• To attain the skills through lifelong learning.

Department of CSE (Artificial Intelligence and Machine Learning)

VISION
• To establish ourselves as a globally recognized leader in AI&ML education and
research.
• To strive towards shaping the future of AI &ML through innovative discoveries,
interdisciplinary collaboration, and industry partnerships.
• To inspire and empower individuals to make meaningful contributions to the
advancement of AI&ML technologies and their positive impact on society.

MISSION

• To provide outstanding education, conduct cutting-edge research, and promote

innovation in artificial intelligence and machine learning.
• To equip students with the necessary skills to excel in their professional careers
and make significant contributions to society by developing ethical and
impactful applications in the fields of Artificial Intelligence and Machine Learni
PROGRAM OUTCOMES (POs)

Engineering & Technology Engineering Graduates will be able to:

PO1. Engineering knowledge: Apply the knowledge of mathematics, science, engineering

fundamentals, and an engineering specialization to the solution of complex engineering problems.

PO2. Problem analysis: Identify, formulate, review research literature, and analyze complex
engineering problems reaching substantiated conclusions using first principles of mathematics,
natural sciences, and engineering sciences.

PO3. Design/development of solutions: Design solutions for complex engineering

problemsanddesignsystemcomponentsorprocessesthatmeetthespecifiedneeds with appropriate
consideration for the public health and safety, and the cultural, societal, and environmental
considerations.

PO4. Conduct investigations of complex problems: Use research-based knowledge and research
methods including design of experiments, analysis and interpretation of data, and synthesis of the
information to provide valid conclusions.

PO5. Modern tool usage: Create, select, and apply appropriate techniques, resources, and modern
engineering and IT tools including prediction and modeling to complex engineering activities with
an understanding of the limitations.

PO6. The engineer and society: Apply reasoning informed by the contextual knowledge to assess
societal, health, safety, legal and cultural issues and the consequent responsibilities relevant to the
professional engineering practice
PO7. Environment and sustainability: Understand the impact of the professional engineering
solutions in societal and environmental contexts, and demonstrate the knowledge of, and need
for sustainable development.

PO8. Ethics: Apply ethical principles and commit to professional ethics and responsibilities and
norms of the engineering practice.
PO9. Individual and team work: Function effectively as an individual, and as a member or leader in
diverse teams, and in multidisciplinary settings.

PO10. Communication: Communicate effectively on complex engineering activities with the

engineering community and with society at large, such as, being able to comprehend and write
effective reports and design documentation, make effective presentations, and give and receive clear
instructions.

PO11. Project management and finance: Demonstrate knowledge and understanding of the
engineering and management principles and apply these to one’s own work, as a member and leader
in a team, to manage projects and in multidisciplinary environments.

PO12. Life-long learning: Recognize the need for, and have the preparation and ability to engage in
independent and life-long learning in the broadest context of technological change.
PROGRAM EDUCATIONAL OBJECTIVES (PEOS)

PEO1: To equip graduates with technical, communication, and entrepreneurial skills for
designing and implementing AI solutions, grounded in strong engineering and advanced AI
principles.

PEO2: To engage in productive work as a design and development engineer and provide
support and leadership in cross-functional disciplines.

PEO3: To progress as graduates with the requisite skills and knowledge to pursue higher
education and research in the field of Artificial Intelligence and Machine Learning (AIML)

PROGRAM SPECIFIC OUTCOMES (PSOS)

PSO1: Apply the principal concepts of fundamental AI Engineering principles to create,

construct, implement, and model AI subsystems.

PSO2: Graduates should be able to apply technical knowledge and utilize modern AI&ML
hardware and software tools to solve real-world problems.
 VEL TECH HIGH TECH
Dr. RANGARAJAN Dr. SAKUNTHALA ENGINEERING
COLLAGE
An Autonomous Institution
Approved by AICTE-New Delhi, Affiliated to Anna University, Chennai
Accredited by NBA, New Delhi & Accredited by NAAC with “A” Grade & CGPA of 3.27

Course Code 21HC67P Semester VI

Category PROFESSIONAL RECOURSE(PCC) L T P C

Course Title INTERNET PROGRAMMING LABORATORY 0 0 4 2

COURSE OBJECTIVES
● The Capabilities to Understand and a Web page using HTML/XML style sheets.
● Tounderstandhowtoworkwithdynamicwebpagecreationusingclientandserverside
scripting.
● To learn the basic and import and design concepts of Web applications using PHP.
● To Understand and creating the applications using AJAX.
PREREQUISITE:
● Basic Programming Skill
COURSE OUTCOME

CO. No. Course Outcomes Blooms Level

Unsuccessful Completion of this Course, students will be able to
C607.1 Develop Web pages using HTML/ XML and style sheets. K3

C607.2 Develop dynamic web pages with validation using Java Script K3
objects and event handling mechanisms.
C607.3 Develop Dynamic Web Pages Using Server Side Scripting. K3

C607.4 Develop web applications using PHP programming. K3

C607.5 Build web applications using AJAX and Web services. K3

COURSE OUTCOMES MAPPING WITH PROGRAM OUTCOMES AND PROGRAM SPECIFIC

OUTCOMES

[Link]. PO1 PO2 PO3 PO4 PO5 PO6 PO7 PO8 PO9 PO10 PO11 PO12 PSO1 PSO2
C607.1 3 3 2 1 - - - - - - - - 2 2
C607.2 3 3 2 1 - - - - - - - - 2 2
C607.3 3 3 2 1 - - - - - - - - 2 2
C607.4 3 3 2 1 - - - - - - - - 2 3
C607.5 3 3 2 1 - - - - - - - - 2 2
Note: 1: Slight, 2: Moderate, 3: Substantia
21HC67P- INTERNET PROGRAMMING LAB No. of Credits:2

List of Experiments
1. Create a webpage with the following using HTML
a. Embed a map in a webpage
b. To fix the hot spots in that map
c. Show all the related information when hot spots are clicked
2. Create A Webpage With the following.
a. Cascading Style Sheets.
b. Embedded Style sheets.
c. Inline style sheets. Use our college information for the Web Pages.
3. Validate the Registration, user login, user profile and payment by credit card pages
using JavaScript.
4. Write Programs in Java using Servlet:
a. To invoke servlets from HTML forms
b(i). Session tracking using hidden form fields
b(ii). Session tracking a hit count
5. Write programs in Java To create three-tier applications using servlets for conducting on- line
examination for displaying student mark list. Assume that student information is available in a
database which has been stored in a database server.

6. Install TOMCAT web server. Convert the static web pages of programs into dynamic web pages
using servlets (or JSP) and cookies. Hint: Users information (user id, password, credit card number)
would be stored in [Link]. Each user should have a separate Shopping Cart.

7. Redo the previous task using JSP by converting the static web pages intodynamic web pages.
Create a database with user information and books information. The books catalogue should be
dynamically loaded from the database.

8. Create and save XML document at the server, which contains10 users Information. Write a Program,
which takes user Id as an input and returns the User details by taking the user information from the
XML document

9. Write a PHP script to validate and store form data into a database

10. Write a web service for finding what people think by asking 500 people 's opinion for any
c consumer product.

11. Create a web page using HTML5.0 with the source of video player and also review the feed
back to display about the content of the topic related to the video.

12. Write a program to implement the string manipulation in Java using the encode and decode a string to
get displayed as a result.

Total: 60 Periods
 TABLE OF CONTENTS

EXP. DATE TITLE OF THE PROGRAM PAGE MARKS SIGN

NO NO
Create a webpage with the following using HTML
1. a. Embed a map in a webpage
b. To fix the hot spots in that map
c. Show all the related information when hot
spots are clicked
Create A Webpage With the following.
2. a. Cascading Style Sheets.
b. Embedded Style sheet
c. Inline style sheets. use our college
information for the web pages.
Validate the Registration, user login, user profile and
3. payment by credit card pages using JavaScript.
Write Programs in Java using Servlet:
4. a. To invoke servlets from HTML form
b(i). Session tracking using hidden form fields
b(ii). Session tracking a hit count
Write programs in java to create three-tier applications
5. using servlets for conducting on- line examination for
displaying student mark list. Assume that student
informationis available in a database which has been
stored in a database server.
Install TOMCAT web server. Convert the static
6. web pages of programs into dynamic web pages
using servlets (or JSP) and cookies. Hint: Users
information (user id, password, credit card
number) would be stored in [Link]. Each user
should have a separate Shopping Cart.
Redo the previous task using JSP by converting the
7. static web pages intodynamic web pages. Create a
database with user information and books information.
The books catalogue should be dynamically loaded from
the database.
Create and save XML document at the server, which
8. contains10 users Information. Write a Program, which
takes user Id as an input and returns the User details by
taking the user information from the XML document
Validating and storing a form data into database using
9. PHP
 Write a web service for finding what people think
10. by asking 500 people 's opinion for any consumer
product.
Create a web page using HTML5.0 with the source of
11. v ideo player and also review the feed back to display
about the content of the topic related to the video.
Write a program to implement the string manipulation in
12. Java using the encode and decode a string to get displayed
as a result.
EX NO:1 CREATING A WEBPAGE USING HTML

AIM:

To Create a web page with the following using HTML

i) To embed an image map in a web page
ii) To fix the hot spots
iii) Show all the related information when the hot spots are clicked.

ALGORITHM:

Step1 : Open a notepad.

Step 2: Write the code for [Link].
Step 3: Enter a program that includes tags for <MAP> and other [Link] 4:
Insert Hyperlink using <A href>.
Step5: Save the file with .html extension. Step6:
Run the program in a web browser Step7: Display
Results.
PROGRAM:

[Link]

<html>
<head>
<title>Home - States of India!!!</title>
</head>
<body bgcolor="gold">
<h1><u><center>Republic of India</center></u></h1>
<p><h2>
India is the Seventh Largest country in the world by geographical area,
the second most populous country with over 1.2 billion people, and the populous democracy
in the world.</h2>
</p>
<h1> Features</h1>
<ul>
<li><b><h2>Population</b> - 1,028,783,343(2001 census).</h2>
<li><b><h2>Capital</b> - New Delhi</h2>
<li><b><h2>Currency</b> - Indian Rupee</h2>
<li><b><h2>Nation Sport</b> - Hockey</h2>
</li>
</ul>
<center>
<img align="left" size="8" src="[Link]" usemap="#india"/>
<map name="india">
<area shape="circle" coords="348,600,20" href="[Link]">
<area shape="circle" coords="289,760,10" href="[Link]">
<area shape="circle" coords="266,620,35" href="[Link]">
<area shape="circle" coords="336,730,35" href="[Link]">
</map>
</center>
<h1><center> <b>To view details of states please click on the specified area in the map
!!!</b></center>
</h1>
</body>
</html>

[Link]

<html>
<head>
<title>Tanil Nadu - India</title></head>
<body bgcolor="palegreen">
<h1><center>Tamil Nadu</center></h1>
<h3>It is one of the 28 states of India. Its capital and largest city is Chennai. Tamil Nadu lies
in the southernmost part of the Indian Peninsula and is bordered by the States of puducherry,
Kerala, Karnataka, Andhra Pradesh.</h3>
<h3>
<ul>
<li>Districts<i> - 32</i>
</li><li>Capital City<i> - Chennai</i>
</li><li>Largest City<i> - Chennai</i>
</li><li>Governor<i> - Banwarilal Purohit</i>
</li><li>Chief Minister<i> - Edappadi K. Palaniswami</i>
</li><li>Population<i> - 72,138,958</i>
</li><li>Tourist spots<i> - Mamallapuran, Ooty, Kodaikanal, Marina,Mudurai Meenakshi
Amman Temple, Thanjavur etc.,</i>
</li></ul>
<a href="[Link]">back</a>
</h3>
</body>
</html>

[Link]

<html>
<head>
<title>Andhra Pradesh - India</title>
</head>
<body bgcolor="tan">
<h1><center>Andhra Pradesh</center></h1>
<h3>A.P, is a state situated on the southeastern coast of India. It is India's fourth largest state
by area and fifth largest by population.</h3>
<h3>
<ul>
<li>Districts<i> - 23</i>
</li><li>Capital City<i> - Hyderabad</i>
</li><li>Largest City<i> - Hyderabad</i>
</li><li>Governor<i> - Biswabhusan Harichandan </i>
</li><li>Chief Minister<i> - Y. S. Jaganmohan Reddy </i>
</li><li>Population<i> - 78,323,330</i>
</li><li>Tourist spots<i> - Tirumala Tirupati, Charminar, Golconda Fort, Chandragiri,
Chowmahalla Place, Falaknuma Palace etc.,</i>
</li></ul>
<a href="[Link]">back</a>
</h3>
</body>
</html>

[Link]
<html>
<head>
<title>Kerala - India</title>
</head>
<body bgcolor="indianred">
<h1><center>Kerala</center></h1>
<h3>
<ul>
<li>Districts<i> - 14</i>
</li><li>Capital City<i> - Thiruvanandapuram</i>
</li><li>Largest City<i> - Thiruvanandapuram</i>
</li><li>Governor<i> - Arif Mohammad Khan</i>
</li><li>Chief Minister<i> - Pinarayi Vijayan</i>
</li><li>Population<i> - 33,387,677</i>
</li><li>Tourist spots<i> - Edakkal Caves, Palayur, Kovalam Beach,Munnar,
Kochi,Alapuzha etc.,</i>
</li></ul>
</h3>
<a href="[Link]">Back</a>
</body>
</html>

[Link]

<html>
<head>
<title>Karnataka - India</title>
</head>
<body bgcolor="wheat">
<h1><center>Karnataka</center></h1>
<h3>
<ul>
<li>Districts<i> - 30</i>
</li><li>Capital City<i> - Bangalore</i>
</li><li>Largest City<i> - Bangalore</i>
</li><li>Governor<i>- Vajubhai Vala</i>
</li><li>Chief Minister<i> - B. S. Yediyurappa</i>
</li><li>Population<i> - 61,130,704</i>
</li><li>Tourist spots<i> - Gol Gumbaz, Mysore Palace, Keshava Temple etc.,</i>
</li></ul>
</h3>
<a href="[Link]">back</a>
</body>
</html>
OUTPUT:

RESULT:
Thus the creation of a web page which includes a map and display the related
information when a hot spot is clicked in the map was executed successfully
EX NO:2 CREATION OF WEB PAGE USING CASCADING STYLE SHEET

AIM:
To create a web page that displays college information using various style sheet

ALGORITHM:

Inline CSS:
Step 1: Create a HTML program with <style> tag.
Step 2: Inside each html element specify the format required for that web page using<style>
tag.
Step3 : Run the program with a web browser.

Internal CSS:
Step 1: Create a HTML program with <style> tag.
Step 2: Inside the <style> tag, specify the format required for that web page.
Step3 : Run the program with a web browser.

External CSS:
Step 1: Open a notepad, type the needed CSS in it and save it with .css extension.
Step2: Refer this .css file in the HTML using the tag <link>.
Step3: Run the program with a web browser.
PROGRAM:

Inline [Link]

<html xmlns="[Link]
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Inline CSS</title>
<link rel="stylesheet" href="[Link]">
</head>
<body>
<h1 style="color:blue;text-align:center;">Example for External CSS</h1>
<p style="color:red;">Vel Tech High Tech [Link] [Link] Engineering
College was established in the year 2002 under [Link], founded by the Philanthropic couple:
Col. Prof. Vel. Dr. R. Rangarajan, Founder President & Chairman and Dr. Sagunthala
Rangarajan, Foundress Vice-Chairman respectively. Under the governance of AICTE & Anna
University, this College has 11 branches of study with 8 UG Programmes and 3 PG
Programmes</p>
<h2 style="color:green;text-align:center;">Image Affected with styles</h2>
<img src="college_logo.png"><br><br>
<a href="college_logo.png" target="_blank">Download Image</a>
</body>
</html>

Internal [Link]

<html xmlns="[Link]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Internal CSS</title>
<style>
body{
background-color:#9F6;
}
h1{
color:#C39;
text-align:left;
text-transform:capitalize;
text-decoration:underline;
}
P{
font-size:20px;
font-family:Verdana, Geneva, sans-serif;
background-color:#FFF;
color:#963;
}
h2{
color:#F03;
margin-left:10px;
}
img{
 border:5px double #903;
width:400px;
height:300px;
margin-left:10px;
}
a{
margin-left:10px;
}
a:hover{
color:#009;
font-size:18px;
font-weight:700;
}
</style>
</head>
<body>
<h1>Example for Internal CSS</h1>
<p> Vel Tech High Tech [Link] [Link] Engineering College was established
in the year 2002 under [Link], founded by the Philanthropic couple: Col. Prof. Vel. Dr. R.
Rangarajan, Founder President & Chairman and Dr. Sagunthala Rangarajan, Foundress Vice-
Chairman respectively. Under the governance of AICTE & Anna University, this College has
11 branches of study with 8 UG Programmes and 3 PG Programmes</p>
<h2>Image Affected with styles</h2>
<img src="college_logo.png"><br><br>
<a href="college_logo.png" target="_blank">Download Image</a>
</body>
</html>

[Link]

<style>
body{
background-color:#9F6;
}
h1{
color:#C39;
text-align:left;
text-transform:capitalize;
text-decoration:underline;
}
P{
font-size:20px;
font-family:Verdana, Geneva, sans-serif;
background-color:#FFF;
color:#963;
}
h2{
color:#F03;
margin-left:10px;
}
 img{
border:5px double #903;
width:400px;
height:300px;
margin-left:10px;
}
a{
margin-left:10px;
}
a:hover{
color:#009;
font-size:18px;
font-weight:700;
}
</style>

External [Link]

<html xmlns="[Link]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>External CSS</title>
<link rel="stylesheet" href="[Link]">
</head>
<body>
<h1>Example for External CSS</h1>
<p>Vel Tech High Tech [Link] [Link] Engineering College was established
in the year 2002 under [Link], founded by the Philanthropic couple – Col. Prof. Vel. Dr. R.
Rangarajan, Founder President & Chairman and Dr. Sagunthala Rangarajan, Foundress
Vice-Chairman respectively. Under the governance of AICTE & Anna University, this
College has 11 branches of study with 8 UG Programmes and 3 PG Programmes</p>
<h2>Image Affected with styles</h2>
<img src="college_logo.png"><br /><br />
<a href="college_logo.png" target="_blank">Download Image</a>
</body>
</html>
OUTPUT:

RESULT:
Thus the creation of a web page that displays college information using various style
sheet was successfully executed and verified.
EX NO: 3 FORM VALIDATION USING JAVASCRIPT

AIM:
To validate the registration,user login,user profile and payment by credit card pages
using JavaScript.

ALGORITHM:

Login page

Step1: Create Web page using HTML form that contains the fields such as Credit Card
Number, amount and a validate button.
Step2: Set the URL of the server as the value of form.(Set registration html as the link when
user clicks registration )Redirect to [Link] if username and password is valid
Step3: Run the HTML program.
Step4: Submit the login data to the server.

Profile page

Step1: Create Web page using HTML form that contains the Text fields such as User Name,
Password, Login and Cancel buttons.
Step2: Set the URL of the server as the value of form.
Step3: Run the HTML program.
Step4: Submit the data to the server
Step5: Server validates the data and on successful validation it prints a message that payment
done, otherwise prints data is invalid.

Form validation

Step1: Create Web page using HTML from that contains the Text fields such as Name, Email,
Pin code, a Name of the country Dropdown button and a submit buttons.
Step3: Run the HTML program.
Step4: On Submit the data gets Validated.
PROGRAM:

Login [Link]

<html>
<head>
<title>Login page</title>
</head>
<body>
<h1
style="font-family: Comic Sans Ms; font-size: 20pt; color: red;text-align="center";>
Login Page</h1>
<form name="login">
Username<input type="text" name="userid" />
Password<input type="password" name="pswrd" />
<input type="button" onclick="check([Link])" value="Login" />
<input type="reset" value="Cancel" /> <br>
<a href="[Link]">Register</a>
</form>
<script language="javascript">
function check(form)/*function to check userid & password*/
{
if ([Link] == "test" && [Link] == "pass")
{
[Link]('[Link]')
}
else
{
alert("Enter valid Username and Password")
}
}
</script>
</body>
</html>

[Link]

<html>
<head>
<script>
function validateCard(){
var numdigits = [Link];

if(numdigits <9 || isNaN( [Link])){

alert("Card number should be greater than 9");
return false;
}else{
if([Link]!="" && (!isNaN( [Link]))){
alert("Payment done");
}else{
alert("Enter the amount");
return false;
}
}
}
</script>
</head>
<title>Profile page</title>
<h1>Welcome User</h1>
You can make payment here
<form name="myForm" onsubmit="return(validateCard());">
<table>
<tr>
<td align="right">Credit card</td>
<td><input type="text" name="card" /></td>
</tr>
<tr>
<td align="right">Enter the amount(Without comma)</td>
<td><input type="text" name="amt" /></td>
</tr>
<tr>
<td align="right"></td>
<td><input type="submit" value="Validate" /></td>
</tr>
</table>
</form>

[Link]

<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">
function validate(){
if( [Link] == "" )
{
alert( "Please provide your name!" );
[Link]() ;
return false;
}
if( [Link] == "" )
{
alert( "Please provide your Email!" );
[Link]() ;return false;}
else
{
var uemail = [Link];
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if()
{
alert("You have entered an invalid email address!");
[Link]() ;
return false;
}
}
if( [Link] == "" || isNaN( [Link] ) ||
[Link] > 6)
{
alert( "Please provide a Pin Code lesser than 7 characters." );
[Link]() ;
return false;
}
if( [Link] == "-1" ) {
alert( "Please provide your country!" );
return false;
}
alert("VALIDATED");
}
</script>
</head>
<body>

<form name="myForm" onsubmit="return(validate());">

<table cellspacing="2" cellpadding="2" border="1">
<tr>
<td align="right">Name</td>
<td><input type="text" name="Name" /></td>
</tr>
<tr>
<td align="right">EMail</td>
<td><input type="text" name="EMail" /></td>
</tr>
<tr>
<td align="right">Pin Code</td>
<td><input type="text" name="Zip" /></td>
</tr>
<tr>
<td align="right">Country</td>
<td><select name="Country">
<option value="-1" selected>[choose yours]</option>
<option value="1">USA</option>
<option value="2">UK</option>
<option value="3">INDIA</option>

</tr>
<tr>
</tr>
</table>
</form>
</body>
</html>
</select></td>
<td align="right"></td>
<td><input type="submit"
value="Submit" /></td>

OUTPUT:
RESULT:

Thus the validation of the registration, user login, user profile and payment by credit
card pages using JavaScript was successfully executed and verified.
EX NO: 4(a) INVOKING SERVLETS FROM HTML FORM

AIM:
To write a java program to invoke servlets from HTML form.

ALGORITHM:

[Link]:

Step1: Create a web page using HTML form that contains the fields such as label,text
and one submit button.
Step2: Set the URL of the server as the value of form’s action attribute.
Step3: Run the HTML program.
Step4: Submit the form data to the server.

[Link]:

Step1: Define the class server that extends the property of the class GenericServlet.
Step2: Handle the request from the client by using the method service() of
GenericServlet class.
Step3: Get the parameter names from the HTML form by using the method
getParameterNames().
Step4: Get the parameter values from the HTML forms by using the method getParameter().
Step5: Send the response to the client by using the method of PrintWriter class.
PROGRAM:

[Link]

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Login Page</title>
</head>
<body>
<form name="loginForm" method="post" action="MyFirstServlet">
Username: <input type="text" name="username"/> <br/>
Password: <input type="password" name="password"/> <br/>
<input type="submit" value="Login" />
</form>
</body>
</html>

[Link]:

import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];

@WebServlet("/MyFirstServlet")
public class MyFirstServlet extends HttpServlet
{
public MyFirstServlet()
{

super();
[Link]("Iam created");
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException
{
[Link]().append("Served at: ").append([Link]());
String username = [Link]("username");
String password = [Link]("password");

[Link]("username: " + username);

[Link]("password: " + password);

PrintWriter writer = [Link]();

 String htmlRespone = "<html>";
htmlRespone += "<h2>Your username is: " + username + "<br/>";
htmlRespone += "Your password is: " + password + "</h2>";
htmlRespone += "</html>";
[Link](htmlRespone);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException
{
doGet(request, response);
}
}

OUTPUT:

RESULT:
Thus the java program to invoke servlets from HTML form has been executed
successfully.
EX NO:4b.(i) SESSION TRACKNG USING HIDDEN FORM FIELDS

AIM:
To perform session tracking using hidden form fields.

ALGORITHM:

Step1: Create a html file which contains user information.

Step2: The first servlet will receive these values.

Step3: First servlet stores them in the hidden form fields.

Step4: The second servlet will display the user information with greeting message.
PROGRAM:

Html Code:

<html>
<head>
<title>Session Tracking Using Hidden Form Field</title>
</head>
<body>
<form action="Servlet1">
Enter Name:<input type="text" name="username"/><br/>
Enter city:<input type="text" name="usercity"/><br/>
<input type="submit" value="submit"/>
</form>
</body>
</html>

Servlet1:

import [Link].*;
import [Link].*;
import [Link].*;
public class Servlet1 extends HttpServlet
{
public void doGet(HttpServletRequest request,HttpServletResponse response)
{
try
{
[Link]("text/html");
PrintWriter out = [Link]();
String n=[Link]("username");
String c=[Link]("usercity");
[Link]("<form action=\"Servlet2\">");
[Link]("<input type='hidden' name='uname' value="+n+"'>");
[Link]("<input type='submit' value='Just click here'>");
[Link]("</form>");
[Link]();
}
catch(Exception e)
{
[Link](e);
}
}
}
Servlet2:

import [Link].*;
import [Link].*;
import [Link].*;
public class Servlet2 extends HttpServlet
{
public void doGet(HttpServletRequest request,HttpServletResponse response)
{
try
{
[Link]("text/html");
PrintWriter out = [Link]();
String n=[Link]("uname");
[Link]("Hello"+n);
String c=[Link]("usercity");
[Link]("you are from"+c);
[Link]();
}
catch(Exception e)
{
[Link](e);
}
}
}
OUTPUT:

RESULT:
Thus the Java Program for Session Tracking Using Hidden Form Fields has been
executed successfully.
EX NO:4.b(ii) SESSION TRACKING A HIT COUNT

AIM:
To write a Java Program for Session tracking a hit count. This servlet uses session
tracking to count the number of times a client has accessed it.

ALGORITHM:

Step1: Servlet program to keep track of user visiting the page.

Step2: The count is incremented by one when user visits.

Step3: The output displays the greeting message.

Step4: The number of previous access is also display

PROGRAM:

import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];

@WebServlet("/HCounterServlet")
public class HCounterServlet extends HttpServlet
{
public HCounterServlet()
{
super();
}

protected void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException
{
[Link]().append("Served at: ").append([Link]());
HttpSession session = [Link](true);
[Link]("text/html");
PrintWriter out = [Link]();
Integer count = new Integer(0);
String head;
if ([Link]())
{
head = "Welcome New [Link] is your first visit";
}
else
{
Integer oldcount = (Integer) [Link]("count");
if (oldcount != null)
{
count = new Integer([Link]() + 1);
}
head = "This is your vist# :" +(count+1);
}
[Link]("count", count);
[Link]("<HTML><BODY BGCOLOR=\"#FDF5E6\">\n" + "<H2
ALIGN=\"CENTER\">" + head + "</H2>\n</BODY></HTML>");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
doGet(request, response);
}
}
 OUTPUT:

RESULT:
Thus the Java program for Session tracking a hit count was successfully executed and
verified.
EX NO: 5 THREE-TIER APPLICATIONS USING SERVLETS

AIM:

To write java servlet programs to conduct online examination and to display student mark list
available in a database.

ALGORITHM:

Client:
• In [Link] on the client side declare the contents that you like to transfer to the
server using html form and input type tags.
• Create a submit button and close all the included tags.

Server:
• Import all necessary packages
• Define a class that extends servlet
• In the doPost() method, do the following:
i. Set the content type of the response to "text/html"
ii. Create a writer to the response
iii. Get a paratmeter from the request
iv. If its value is equal to right answer then add 5 to mark variable
v. Similarly repeat step for all parameters
vi. Create a new jsp to read the values from DB and send the result in an html format.

Student Mark List Database:

• Import necessary to java packages and javax packages and classes
• Create a class that extends HttpServlet and implements ServletException
• and IOException
• In the doGet() method, do the following:
i. Create a PrintWriter object
ii. Open a connection with the data source name
iii. Write a sql query and execute to get the resultset
iv. Display the resultset information in html form
PROGRAM:

[Link]:

<html>
<head>
<title>Online Examination</title>
<script language="javascript">
function validation(Form_obj) {
if (Form_obj.Seat_no.[Link] == 0) {
alert("Please,fill up the Seat Number");
Form_obj.Seat_no.focus();
return false;
}
if (Form_obj.[Link] == 0) {
alert("Please,fill up the Name");
Form_obj.[Link]();
return false;
}
return true;
}
</script>
</head>

<body bgcolor=lightgreen>
<center>Online Examination</center>
<form action="OEValidator" method="post" name="entry"
onSubmit="return validation(this)">
<input type="hidden" value="list" name="action">
<hr />
<table>
<tr>
<td></td>
<td></td>
</tr> <td><b>Time: 1 Min.</b></td>
<tr>

</tr>
<tr>
</tr>
</table>
<hr />
<td>Seat Number :</td>
<td><input type="text"
name="Seat_no"></td>
<td>Name :</td>
<td><input type="text"
name="Name"
size="50"></td>
<td><b>Total
Marks:5*5=25 </b></td>
 <td></td>
<b>1 . Earth is round</b><br /> <input type="radio" name="group1"
value="True">True <input type="radio" name="group1"
value="False">False<br> <br /> <b>2. Satelites revolve in
space.</b><br /> <input type="radio" name="group2"
value="True">True <input type="radio" name="group2"
value="False">False<br> <br /> <b>3. You can go to moon via space
shuttle</b><br /> <input type="radio" name="group3"
value="True">True <input type="radio" name="group3"
value="False">False<br> <br /> <b>4There is zero gravity in
space.</b><br /> <input type="radio" name="group4" value="True">True
<input type="radio" name="group4" value="False">False<br>
<br /> <b>5. Kapana Chawla is first indian woman to go to space</b><br />
<input type="radio" name="group5" value="True">True <input
type="radio" name="group5" value="False">False<br>
<hr />
<center>
<input type="submit" value="Submit"> <input type="reset"
value="Clear"><br>
<br>
</center>
</form>

SERVLET Code:

import [Link];
import [Link].*;
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];

@WebServlet("/OEValidator")
public class OEValidator extends HttpServlet {
private static final long serialVersionUID = 1L;
public OEValidator() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// TODO Auto-generated method stub
try {
String SeatNum, Name;
String ans1, ans2, ans3, ans4, ans5;
int a1, a2, a3, a4, a5;
a1 = a2 = a3 = a4 = a5 = 0;
Connection connect = null;
Statement stmt = null;
ResultSet rs = null;
[Link]("[Link]");
String filename = "E:/OELabExercise/[Link]";
String database = "jdbc:ucanaccess://" + filename;
 connect = [Link](database, "", "");
if ([Link]("action") != null) {
SeatNum = [Link]("Seat_no");
Name = [Link]("Name");
ans1 = [Link]("group1");
if ([Link]("True"))
a1 = 5;
else
a1 = 0;
ans2 = [Link]("group2");
if ([Link]("True"))
a2 = 0;
else
a2 = 5;
ans3 = [Link]("group3");
if ([Link]("True"))
a3 = 0;
else
a3 = 5;
ans4 = [Link]("group4");
if ([Link]("True"))
a4 = 5;
else
a4 = 0;
ans5 = [Link]("group5");
if ([Link]("True"))
a5 = 0;
else
a5 = 5;
int Total = a1 + a2 + a3 + a4 + a5;
stmt = [Link]();
String query = "INSERT INTO StudentTable (" + "Seat_no,Name,Marks" + ") VALUES ('" +
SeatNum + "', '" + Name + "', '" + Total + "')";
[Link]("QUERY " + query);
int result = [Link](query);
[Link]();
}
} catch (Exception e) {
[Link]();
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
JSP Code:

<%@page import="[Link]"%>
<%@page import="[Link]"%>
<%@page import="[Link]"%>
<%@page import="[Link]"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"[Link]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<%
try {
Statement statement;
ResultSet resultSet = null;
[Link]("[Link]");
String filename = "E:/OELabExercise/[Link]";
String database = "jdbc:ucanaccess://" + filename;
Connection con = [Link](database, "", "");
statement = [Link]();
resultSet = [Link]("SELECT * FROM STUDENTTABLE");
%>
<table border=1 align=center style="text-align: center">
<thead>
<tr>
<th>[Link]</th>
<th>NAME</th>
<th>Marks</th>
</tr>
</thead>
<tbody>
<%
while ([Link]()) {
%>
<tr>
<td><%=[Link](1)%></td>
<td><%=[Link](2)%></td>
<td><%=[Link](3)%></td>
</tr>

<%
}
%>
</tbody>
</table>
<br>
<%
} catch (Exception e) {
[Link]();
}
%>
</body>
</html>

OUTPUT:

RESULT:
Thus to write java servlet programs to conduct online examination and to display
student mark list available in a database was successfully executed and verified.
EX NO: 6: INSTALLING TOMCAT AND CONVERTING STATIC WEB PAGES TO
FF DYNAMIC WEB PAGES

AIM:
To install tomcat and convert the static web pages into dynamic web pages using
servlets (or JSP) and cookies.

ALGORITHM:

Step1: We will create a html form for entering the user name,password and card ID.
Step2: From the above HTML form, the servlet program is invoked in which the validity of
the user name,password and card id is [Link] it is a valid user then the welcome
message will be displayed otherwise the “invalid user” message will be displayed. In
this servlet we set the cookies in which the current user name is stored.
Step3: Compile the above servlet Login [Link] We must store the user information such
as user name,password and card id in the init-param using initParams argument of the
@webServlet annotation.
Step4: On successful login , the information from the cookie is checked and shopping cart
page for corresponding user can be displayed.
Step5: Compile the above servlet [Link]
Step6: Start tomcat web [Link] the web browser and display the login form created in
step1.
PROGRAM:

[Link]:

<html>
<head>
<body>
<form action="LoginServlet" method="post">
Enter Username:
<input type="text" name="user">
<br>
Enter Password:
<input type="password" name="password">
<br>
Enter Card ID:
<input type="text" name="cardID">
<br>
<br><br><br>
<input type="submit" value="login">
</form>
</body>

[Link]:

import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
@WebServlet(
urlPatterns = { "/LoginServlet" },initParams = {
@WebInitParam(name = "usernames", value = "user1,user2,user3"),
@WebInitParam(name = "passwords", value = "pwd1,pwd2,pwd3"),
@WebInitParam(name = "cardIDs", value = "111,222,333")
})
public class LoginServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

public LoginServlet() {
super();
// TODO Auto-generated constructor
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException {
[Link]("text/html;charset=UTF-8");
PrintWriter out = [Link]();
try {

String usr=[Link]("user");
String pwd=[Link]("password");
String card=[Link]("cardID");
boolean flag=true;

String[] userID=getInitParameter("usernames").split(",");
String[] password=getInitParameter("passwords").split(",");
String[] cardids=getInitParameter("cardIDs").split(",");

int i;
for(i=0;i<[Link];i++)
{
if(userID[i].equals(usr)&&password[i].equals(pwd)&&cardids[i].equals(card))
{
flag=false;
Cookie MyCookie=new Cookie("CurrentUser", usr);
[Link](60*60);
[Link](MyCookie);
[Link]("LoginSucess");
}
}
if(flag==true)
{
[Link]("Error");
[Link]("<h4>Invalid user,please try again by clicking following link</h4>");

[Link]("<a href='[Link]'>Login</a>");
}
}
finally {
[Link]();
}

}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
[Link]:

import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];

@WebServlet("/LoginSucess")
public class LoginSucess extends HttpServlet {
private static final long serialVersionUID = 1L;

public LoginSucess() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException {
Cookie[] my_cookies=[Link]();
[Link]("text/html");
PrintWriter out=[Link]();
[Link]("Login Success");
[Link]("<b>");
String userName=null;
if(my_cookies!=null)
{
for(Cookie cookie:my_cookies)
{
if([Link]().equals("currentUser"))
userName=[Link]();
}
}
[Link]("<h3>Login Success!!!Welcome</h3>");
[Link]("<h2>This is a Shopping cart for"+userName+"</h2>");
[Link]();
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws
ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}

}
 OUTPUT:

RESULT:

Thus the tomcat installation and conversion of the static web pages intodynamic web
pages using servlets cookies has been executed successfully.
EX NO:7 CONVERTING STATIC WEB PAGES TO DYNAMIC WEB PAGES
FVVVVVV (USER INFORMATION AND BOOKS INFORMATION)

AIM:
To convert the static web pages (user information and books information) into dynamic
web pages using JSP.

ALGORITHM:
Step 1: Create your own directory under tomcat/webapps (e.g. tr1)
Step 2: Copy the html files in tr1
Step 3: Copy the jsp files also into tr1
Step 4: Start tomcat give the following [Link] runAt install-dir/bin
Step 5: At I.E give url as [Link]
PROGRAM:

[Link]:

<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/[Link]”>LOGIN</a>
href=”/tr/[Link]”>REGISTRATION</a></div></pre>
</body>
</html>

[Link]:

<html>
<body bgcolor=”pink”><br><br><br>
<form name="myform" method="post" action=/tr1/[Link]">
<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>

[Link]:

<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/[Link]">
<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>

[Link]:

<html>
<body bgcolor="pink"><br><br>
<form name="myform" method="post" action="/tr1/[Link]">
<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>

[Link]:

<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/[Link]">

<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=”button2”>
</form>
</body>
</html>

[Link]:

<html>
<body bgcolor="pink"><br><br><br>
<form method="post" action="/tr1/[Link]">
<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>

[Link]:

%@page import=”[Link].*”%
%@page import=”[Link].*”%
<%

[Link](“<html><body bgcolor=\”pink\”>”);
String id=[Link](“id”);
String pwd=[Link](“pwd”);
Driver d=new [Link]();
[Link](d);
Connection
con=[Link](“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=[Link]();
String sqlstmt=”select id,password from login where id=”+id+” and
password=”+pwd+””;
ResultSetrs=[Link](sqlstmt);
int flag=0;
while([Link]())
{
flag=1;
}
if(flag==0)
{
[Link](“SORRY INVALID ID TRY AGAIN ID<br><br>”);
[Link](“ <a href=\”/tr1/[Link]\”>press LOGIN to RETRY</a>”);
}
else
{
[Link](“VALID LOGIN ID<br><br>”);
[Link](“<h3><ul>”);
[Link](“<li><ahref=\”[Link]\”><fontcolor=\”black\”>USER
PROFILE</font></a></li><br><br>”);
[Link](“<li><ahref=\”[Link]\”><fontcolor=\”black\”>BOOKS
CATALOG</font></a></li><br><br>”);
[Link](“<li><ahref=\”[Link]\”><fontcolor=\”black\”>ORDER
CONFIRMATION</font></a></li><br><br>”);
[Link](“</ul>”);
}
[Link](“<body></html>”);
%>
[Link]:

%@page import=”[Link].*”%
%@page import=”[Link].*”%
<%
[Link](“<html><body bgcolor=\”pink\”>”);
String name=[Link](“name”);
String addr=[Link](“addr”);
String phno=[Link](“phno”);
String id=[Link](“id”);
String pwd=[Link](“pwd”);
int no=[Link](phno);
Driver d=new [Link]();
[Link](d);
Connection con=
[Link] (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=[Link]();
String sqlstmt=”select id from login”;
ResultSetrs=[Link](sqlstmt);
int flag=0;
while([Link]())
{
if([Link]([Link](1)))
{
flag=1;
}
}
if(flag==1)
{
[Link](“SORRY LOGIN ID ALREADY EXISTS TRY AGAIN WITH NEW ID
<br><br>”);
[Link](“<a href=\”/tr1/[Link]\”>press REGISTER to RETRY</a>”);
}
else{
Statement stmt1=[Link] ();
[Link] (“insert into login values
(“+name+”,”+addr+”,”+no+”,”+id+”,”+pwd+”)”);
[Link] (“YOU DETAILS ARE ENTERED <br><br>”);
[Link] (“<a href =\”/tr1/[Link]\”>press LOGIN to login</a>”);
}
[Link] (“</body></html>”);
%>

[Link]:

<%@page import=”[Link].*”%>
<%@page import=”[Link].*”%>
<%
[Link] (“<html><body bgcolor=\”pink\”>”);
String id=[Link](“id”);
Driver d=new [Link]();
[Link](d);
Connection con=
[Link] (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=[Link] ();
String sqlstmt=”select * from login where id=”+id+””;
ResultSetrs=[Link] (sqlstmt);
int flag=0;
while([Link]())
{
[Link] (“<div align=\”center\”>”);
[Link] (“NAME :”+[Link](1)+”<br>”);
[Link] (“ADDRESS :”+[Link](2)+”<br>”);
[Link] (“PHONE NO :”+[Link](3)+”<br>”);
[Link] (“</div>”);
flag=1;
}
if(flag==0)
{
[Link](“SORRY INVALID ID TRY AGAIN ID <br><br>”);
[Link](“<a href=\”/tr1/[Link]\”>press HERE to RETRY </a>”);
}
[Link] (“</body></html>”);

%>

[Link]:

<%@page import=”[Link].*”%>
<%@page import=”[Link].*”%>
<%
[Link] (“<html><body bgcolor=\”pink\”>”);
String title=[Link] (“title”);
Driver d=new [Link] ();
[Link] (d);
Connection con=[Link]
(“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=[Link] ();
String sqlstmt=”select * from book where title=”+title+””;
ResultSetrs=[Link] (sqlstmt);
int flag=0;
while([Link]())
{
[Link] (“<div align=\”center\”>”);
[Link] (“TITLE :”+[Link](1)+”<br>”);
[Link] (“AUTHOR :”+[Link](2)+”<br>”);
[Link] (“VERSION:”+[Link](3)+”<br>”);
[Link] (“PUBLISHER :” +[Link](4)+”<br>”);
[Link] (“COST :” +[Link](5)+”<br>”);
[Link] (“</div>”);
flag=1;
}
if(flag==0)
{
[Link](“SORRY INVALID ID TRY AGAIN ID <br><br>”);
[Link](“<a href=\”/tr1/[Link]\”>press HERE to RETRY </a>”);
}
[Link] (“</body></html>”);
%>

[Link]:

<%@page import=”[Link].*”%>
<%@page import=”[Link].*”%>
<%
[Link] (“<html><body bgcolor=\”pink\”>”);
String id=[Link] (“id”);
String pwd=[Link] (“pwd”);
String title=[Link] (“title”);
String count1=[Link] (“no”);
String date=[Link] (“date”);
String cno=[Link] (“cno”);
int count=[Link](count1);
Driver d=new [Link] ();
[Link] (d);
Connection con=
[Link] (“jdbc:oracle:thin:@localhost:1521:orcl”,”scott”,”tiger”);
Statement stmt=[Link] ();
String sqlstmt=”select id, password from login”;
ResultSetrs=[Link] (sqlstmt);
int flag=0,amount,x;
while([Link]())
{
if([Link]([Link](1))&&[Link]([Link](2)))
{
flag=1;
}
}
if(flag==0)
{
[Link](“SORRY INVALID ID TRY AGAIN ID <br><br>”);
[Link](“<a href=\”/tr1/[Link]\”>press HERE to RETRY </a>”);
}
else
{
Statement stmt2=[Link]();
String s=”select cost from book where title=”+title+””;
ResultSet rs1=[Link](s);
int flag1=0;
while([Link]())
{
flag1=1;
x=[Link]([Link](1));
amount=count*x;
[Link](“AMOUNT :”+amount+”<br><br><br><br>”);
Statement stmt1=[Link] ();
[Link] (“insert into details“+id+”,”+title+”,”+amount+”,”+date+”,”+cno+”)”);
[Link] (“YOU ORDER HAS TAKEN<br>”);
}

if(flag1==0)
{

[Link](“SORRY INVALID BOOK TRY AGAIN <br><br>”);

[Link](“<a href=\”/tr1/[Link]\”>press HERE to RETRY </a>”);
}
} [Link] (“</body></html>”);%>

OUTPUT:
RESULT:

Thus the conversion of the static web pages(user information and book information) into
dynamic web pages using JSP has been executed successfully.
 EX NO:8 RETRIEVING USER INFORMATION FROM XML DOCUMENT

AIM:
i) To create and save an XML document at the server, which contain ten users
information.
ii) To write a program which takes user id as an input and returns the user details
by taking the user information from the XML document.

ALGORITM:

Step 1: Save Students information in the XML file on the specific location.
Step 2: Create and establish the connection between html file and XML file.
Step 3: Get the user ID as input
Step 4: Display the student’s information.
PROGRAM:

[Link] :

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

<Student>
<PersonDetails>
<id>101</id>
<name>Anand</name>
<city>Madurai</city>
<Branch>CSE</Branch>
<Year>I</Year>
</PersonDetails>
<PersonDetails>
<id>102</id>
<name>Anu</name>
<city>Konam</city>
<Branch>CSE</Branch>
<Year>II</Year>
</PersonDetails>
<PersonDetails>
<id>103</id>
<name>Archana</name>
<city>Madurai</city>
<Branch>CSE</Branch>
<Year>I</Year>
</PersonDetails>
<PersonDetails>
<id>104</id>
<name>Monica</name>
<city>Nellai</city>
<Branch>CSE</Branch>
<Year>III</Year>
</PersonDetails>
</Student>

[Link] :

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript">
function Display()
{
if([Link])
{
xmlhttp=new XMLHttpRequest();
 }
[Link]("GET","[Link]",false);
[Link]();
xmlDoc=[Link];
var x=[Link]("PersonDetails");
var key_id=[Link]("key").value;
for(i=0;i<[Link];i++)
{
if(key_id.match(x[i].getElementsByTagName("id")[0].childNodes[0].nodeValue))
j=i;
}
[Link]("<h3>User Details are...</h3> <hr> Registeration ID=");
[Link](x[j].getElementsByTagName("id")[0].childNodes[0].nodeValue);
[Link]("</br> Name=");
[Link](x[j].getElementsByTagName("name")[0].childNodes[0].nodeValue);
[Link]("</br> City=");
[Link](x[j].getElementsByTagName("city")[0].childNodes[0].nodeValue);
[Link]("</br> Branch=");
[Link](x[j].getElementsByTagName("Branch")[0].childNodes[0].nodeValue);
[Link]("</br> Year=");
[Link](x[j].getElementsByTagName("Year")[0].childNodes[0].nodeValue);
[Link]("</br> ");
}
</script>
<form name='myform'>
Enter ID:
<input type='text' id='key'/><br/>
<input type='button' value='submit' onclick='Display()'/>
</form>
</body>
</html>
OUTPUT:

RESULT:
Thus the Program takes user id as an input and returns the user details by taking the
user information from the XML document has been executed successfully.
EX NO:9 VALIDATING AND STORING A FORM DATA INTO DATABASE USING
PHP

AIM:

To Validate and store a form data into database using PHP regular expression.

ALGORITHM:

Step 1: Install XAMPP web server.

Step 2: Write a program in a notepad and save it as [Link].
Step 3: After completion of the installation, we can use the XAMPP Control Panel to start/
stop all servers.
Step 4: Start Mysql and Apache servers.
Step 5: Copy [Link] to htdocs (C:/Program Files/XAMPP/htdocs)
Step 6: Now to run our code, open localhost/[Link] then it gets executed.
PROGRAM:

[Link]

<!DOCTYPE HTML>
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>

<?php
// define variables and set to empty values
$nameErr = $emailErr = $genderErr = $websiteErr = "";
$name = $email = $gender = $comment = $website = "";

if ($_SERVER["REQUEST_METHOD"] == "POST")
{
if (empty($_POST["name"]))
{
$nameErr = "Name is required";
}
else
{
$name = test_input($_POST["name"]);
// check if name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name))
{
$nameErr = "Only letters and white space allowed";
}
}

if (empty($_POST["email"]))
{
$emailErr = "Email is required";
}
else
{
$email = test_input($_POST["email"]);
// check if e-mail address is well-formed
if (!filter_var($email, FILTER_VALIDATE_EMAIL))
{
$emailErr = "Invalid email format";
}
}
 if (empty($_POST["website"]))
{
$website = "";
}
else
{
$website = test_input($_POST["website"]);
// check if URL address syntax is valid

if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/
%=~_|]/i",$website)) {
$websiteErr = "Invalid URL";
}
}
if (empty($_POST["comment"]))
{
$comment = "";
} else {
$comment = test_input($_POST["comment"]);
}

if (empty($_POST["gender"]))
{
$genderErr = "Gender is required";
}
else
{
$gender = test_input($_POST["gender"]);
}
}

function test_input($data)
{
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>

<h2>PHP Form Validation </h2>

<p><span class="error">* required field</span></p>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
>
Name: <input type="text" name="name">
<span class="error">* <?php echo $nameErr;?></span>
<br><br>
E-mail: <input type="text" name="email">
<span class="error">* <?php echo $emailErr;?></span>
 <br><br>
Website: <input type="text" name="website">
<span class="error"><?php echo $websiteErr;?></span>
<br><br>
Comment: <textarea name="comment" rows="5" cols="40"></textarea>
<br><br>
Gender:
<input type="radio" name="gender" value="female">Female
<input type="radio" name="gender" value="male">Male
<input type="radio" name="gender" value="other">Other
<span class="error">* <?php echo $genderErr;?></span>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>

<?php
echo "<h2>Your Input:</h2>";
echo $name;
echo "<br>";
echo $email;
echo "<br>";
echo $website;
echo "<br>";
echo $comment;
echo "<br>";
echo $gender;
?>

</body>
</html>
OUTPUT:

Your Input:
sangamithra
sangamithra@[Link]
[Link]
good
female
[Link]

<!DOCTYPE html>
<html>
<head>
<title>PHP insertion</title>
<link href="css/[Link]" rel="stylesheet">
</head>
<body>
<div class="maindiv">
<!--HTML Form -->
<div class="form_div">
<div class="title">
<h2>Insert Data In Database Using PHP.</h2>
</div>
<form action="[Link]" method="post">
<!-- Method can be set as POST for hiding values in URL-->
<h2>Form</h2>
<label>Name:</label>
<input class="input" name="name" type="text" value="">
<label>Email:</label>
<input class="input" name="email" type="text" value="">
<label>Contact:</label>
<input class="input" name="contact" type="text" value="">
<label>Address:</label>
<textarea cols="25" name="address" rows="5"></textarea><br>
<input class="submit" name="submit" type="submit" value="Insert">
</form>
</div>
</div>
</body>
</html>

[Link]

<?php
$connection = mysql_connect("localhost", "root", "");
$db = mysql_select_db("colleges", $connection);
if(isset($_POST['submit']))
{
$name = $_POST['name'];
$email = $_POST['email'];
$contact = $_POST['contact'];
$address = $_POST['address'];
if($name !=''||$email !='')
{
//Insert Query of SQL
$query = mysql_query("insert into students(student_name, student_email, student_contact,
student_address) values ('$name', '$email', '$contact', '$address')");
echo "<br/><br/><span>Data Inserted successfully...!!</span>";
}
else
{
echo "<p>Insertion Failed <br/> Some Fields are Blank. .. !!</p>";
}
}
mysql_close($connection); // Closing Connection with Server
?>

OUTPUT:

RESULT:

Thus the form has been validated using PHP regular expression and also data has been
stored into the database successfully.
EX NO:10 A SURVEY USING WEB SERVICE FOR GETTING AFEEDBACK
ON ANY CONSUMER PRODUCT

AIM:
To create a survey using web service for getting a feedback on any consumer
product.

ALGORITHM:

Step 1: Open the home page.

Step 2: Enter the login ID and type the comments then submit.
Step 3: Retrieve comments with post id
Step 4: Display the comments.
PROGRAM:

[Link]

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>jQuery Ajax Comment System - Demo</title>
<link rel="stylesheet" href="css/[Link]">
<script
src="[Link]
<script src="js/[Link]"></script>
</head>
<body>
<div class="wrap">
<h1> Maggy Noodles Comment System</h1>
<?php
// retrive post
include('[Link]');
include ('[Link]');
dbConnect();

$query = mysql_query(
'SELECT *
FROM post
WHERE post_id = 1');
?> $row = mysql_fetch_array($query);

<div class="post">
<h2><?php echo $row['post_title']?></h2>
<p><?php echo $row['post_body']?></p>
</div>

<?php
// retrive comments with post id
$comment_query = mysql_query(
"SELECT *
FROM comment
WHERE post_id = {$row['post_id']}
ORDER BY comment_id DESC
?> LIMIT 15");

<h2>Comments. ... </h2>

<div class="comment-block">
<?php while($comment = mysql_fetch_array($comment_query)): ?>
<div class="comment-item">
<div class="comment-avatar">
 <img src="<?php echo avatar($comment['mail']) ?>"

alt="avatar"> </div>

<div class="comment-post">
<h3><?php echo $comment['name'] ?>
<span>said. .. </span></h3>
<p><?php echo $comment['comment']?></p>
</div>
</div>
<?php endwhile?>
</div>

<h2>Submit new comment</h2>

<!--comment form -->
<form id="form" method="post">
<!-- need to supply post id with hidden fild -->
<input type="hidden" name="postid" value="<?php echo
$row['post_id']?>">
<label>
<span>Name *</span>
<input type="text" name="name" id="comment-name"
placeholder="Your name here. . " required>
</label>
<label>
<span>Email *</span>
<input type="email" name="mail" id="comment-mail"
placeholder="Your mail here. .. " required>
</label>
<label>
<span>Your comment *</span>
<textarea name="comment" id="comment" cols="30"
rows="10" placeholder="Type your comment here... " required></textarea>
</label>
<input type="submit" id="submit" value="Submit Comment">
</form>
</div>
</body>
</html>

Ajax_Comment.php

<?php
if (isset( $_SERVER['HTTP_X_REQUESTED_WITH'] )):
include('[Link]');
include('[Link]');
dbConnect();

if (!empty($_POST['name']) AND !empty($_POST['mail']) AND

!empty($_POST['comment']) AND !empty($_POST['postid'])) {
$name = mysql_real_escape_string($_POST['name']);
$mail = mysql_real_escape_string($_POST['mail']);
 $comment = mysql_real_escape_string($_POST['comment']);
$postId = mysql_real_escape_string($_POST['postid']);

mysql_query("
INSERT INTO comment
(name, mail, comment, post_id)
VALUES('{$name}', '{$mail}', '{$comment}', '{$postId}')");
}
?>

<div class="comment-item">
<div class="comment-avatar">
<img src="<?php echo avatar($mail) ?>" alt="avatar">
</div>
<div class="comment-post">
<h3><?php echo $name ?> <span>said. ..</span></h3>
<p><?php echo $comment?></p>
</div>
</div>

<?php
dbConnect(0);
endif?>

[Link]

<?php
# db configuration
define('DB_HOST', 'localhost');
define('DB_USER', 'root');
define('DB_PASS', 'root');
define('DB_NAME', 'dbname');
?>

[Link]

<?php
/**
* Connect to mysql server
* @param bool
* @use true to connect false to close
*/
function dbConnect($close=true)
{
if (!$close)
{
mysql_close($link);
return true;
}
 $link = mysql_connect(DB_HOST, DB_USER, DB_PASS) or die('Could not connect
to MySQL DB ') . mysql_error();
if (!mysql_select_db(DB_NAME, $link))
return false;
}

/**
* gravatar Image
* @see [Link]
*/
function avatar($mail, $size = 60){
$url = "[Link]
$url .= md5( strtolower( trim( $mail ) ) );
// $url .= "?d=" . urlencode( $default );
$url .= "&s=" . $size;
return $url;
}
?>

label
{
display: block;
margin: 5px 0;
font-weight: 900;
cursor: pointer;
}

[Link]

/* general styling */
*{
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
font-smoothing: antialiased;
} text-rendering: optimizeLegibility;
body{

font: 12px Arial,Tahoma,Helvetica,FreeSans,sans-serif;

text-transform: inherit;
color: #333;
background: #e7edee;
width: 100%;
} text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2)
.wrap{
 width: 720px;
margin: 15px auto;
padding: 15px 20px;
background: white;
border: 2px solid #DBDBDB;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
overflow: hidden;
}

a{ text-decoration: none; color: #333}

h1{
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 2.8em;
text-align: center;
margin: 25px 0;
}
h2{font-size: 1.5em; margin: 8px 0}
h3{
font-size: 1.2em;
margin: 5px 0;
}
h3 span{
font-weight: normal;
font-size: 1em;
}
.item{
clear: both;
margin:0;
padding: 10px;
overflow: hidden;
border-top: 1px solid #DBDBDB;
}

.item:last-child{border-bottom:1px solid #DBDBDB}

.item:hover{background: #f9f9f9}
.post{
padding: 10px 0;
border-bottom: 1px solid #E6E6E6;
}
.comment-block{
margin: 20px 0 20px 20px;
}
.comment-item{
overflow: hidden;
width: 500px;
clear: both;
padding: 10px;
border: 1px solid #E6E6E6;
border-radius: 5px;
margin: 5px;
}
.comment-avatar{
width: 60px;
float: left;
}
.comment-avatar img{
width: 60px;
height: 60px;
border-radius: 5px;
}
.comment-post{
width: 400px;
float: left;
padding: 0 5px 0 10px;
}
#form{
clear: both;
margin: 10px;
width: 500px;
}

/* form styling */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea {
width:100%;
background: #fff;
border: 1px solid #ddd;
font-size: 13px;
line-height: 20px;
margin: 0;
padding: 7px 10px;
box-shadow: inset 0 1px 2px #eee;
border:1px solid #CCC;
margin:0 0 5px;
border-radius:5px;
}

textarea {
height:100px;
max-width:100%;
}
input[type="submit"] {
cursor:pointer;
width:100%;
border:none;
background:#991D57;
background-image:linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
background-image:-moz-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
 background-image:-webkit-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
color:#FFF;
margin:0 0 5px;
padding:10px;
border-radius:5px;
}
input[type="submit"]:hover {
background-image:linear-gradient(bottom, #9C215A 0%, #A82767 52%);
background-image:-moz-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
background-image:-webkit-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
-webkit-transition:background 0.3s ease-in-out;
-moz-transition:background 0.3s ease-in-out;
transition:background-color 0.3s ease-in-out;
}
input[type="submit"]:active {
box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
input:focus,
textarea:focus {
outline:0;
border:1px solid #999;
}

.alert{
display: none;
padding: 8px 35px 8px 14px;
margin: 20px 0;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
} border-radius: 4px;

[Link]

$(document).ready(function(){
var form = $('form');
var submit = $('#submit');

[Link]('submit', function(e) {
// prevent default action
[Link]();
// send ajax request
$.ajax({
url: 'ajax_comment.php',
type: 'POST',
cache: false,
data: [Link](), //form serizlize data
 beforeSend: function(){
// change submit button value text and disabled it
[Link]('Submitting...').attr('disabled', 'disabled');
},
success: function(data){
// Append with fadeIn see [Link]
var item = $(data).hide().fadeIn(800);
$('.comment-block').append(item);

// reset form and button

[Link]('reset');
[Link]('Submit Comment').removeAttr('disabled');
},
error: function(e){
alert(e);

});
});

});

OUTPUT:

RESULT:
Thus a survey using web service for getting a feedback on any consumer product has
been executed successfully.
EX NO:11 CREATING A HTML5 VIDEO PLAYER AND GETTING FEEDBACK

AIM:

To create a video list using HTML5 and get user Feedback.

ALGORITHM:

Step 1 : Create html5 page and save it

Step 2: Open html body tag and start video tag

Step 3 : Inside video tag add the videos source and mime tag

Step 4 : If video not supported display appropriate massage inside tag and close video tag

Step 5 : Open textarea tag with needed rows and columns

Step 6 : Create a submit button to get user feedback

Step 7 : OnClick of submit call a JavaScript function to display an alert that feedback has
been received and close the textarea tag

Step 8 : Save the file and open in HTML5 enabled browse

PROGRAM:

[Link]

<!DOCTYPE html>
<html>
<body>

<video id="playlist" controls="controls">

<source src="C:\video1.mp4" type="video/mp4">
<source src="c:\video2.mp4" type="video/ogg">
Your browser does not support HTML5 video.
</video>
<BR>
Your Feedback :
</BR>
<textarea name="comments" rows="10" cols="80">
</textarea>
</BR>
<input type="submit" value="Submit" onclick="subFed();">

<script type='text/javascript'>
documentgetElementById('playlist').addEventListener('ended',myHandler,false);
function myHandler(e)
{
if(!e)
{
e = [Link];
}
alert("Video Finished");
}
function subFed()
{
alert("Feedback Submitted");
}
</script>
</body>
</html>
OUTPUT:

RESULT:
Thus the video list is created and user feedback received on clicking submit button
was executed successfully.
EX NO:12 TO ENCODE AND DECODE A STRING USING JAVA

AIM:

To Encode and Decode a string using java

ALGORITHM:

Step 1 : Create a java file and in the main method use a hard coded string to node

Step 2 : Create an object for Base64 encoder

Step 3 : Get bytes of a string and pass it to Base64 object encoding method and string will be
encoded

Step 4 : To decode the string pas the encoded string to decode method of Base64 object and
string will be decoded

Step 5 : Close the main method

PROGRAM:

[Link]

import [Link];
import [Link].Base64;
import [Link];
import [Link];

public class StringEncode

{

public static void main(String[] args)

{

String string = "VELTECH HIGHTECH";

// Encoding
Encoder encoder = [Link]();
byte[] data = [Link](StandardCharsets.UTF_8);
String encodedString = [Link](data);
[Link]("Given String to encode is " + string);
[Link]("Encoded: " + encodedString);

// Decoding
Decoder decoder = [Link]();
byte[] bytes = [Link](encodedString);
String decodedString = new String(bytes, StandardCharsets.UTF_8);

[Link]("Decoded: " + decodedString);

}
 OUTPUT:

RESULT:
Thus the string is encoded and decoded using java security was executed
successfully.