Scribd
Upload
6 views11 pages

BCA WT Lab Manual

The document is a lab manual for the Web Technology course at Vidya Vihar Institute of Technology, detailing experiments for 6th semester Computer Science students. It includes various HTML, JavaScript, and JSP programming tasks, such as creating lists, tables, and handling user input. Each experiment is accompanied by sample code to demonstrate the concepts covered.

Uploaded by

snetin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
6 views11 pages

BCA WT Lab Manual

The document is a lab manual for the Web Technology course at Vidya Vihar Institute of Technology, detailing experiments for 6th semester Computer Science students. It includes various HTML, JavaScript, and JSP programming tasks, such as creating lists, tables, and handling user input. Each experiment is accompanied by sample code to demonstrate the concepts covered.

Uploaded by

snetin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 11

Web Technology Lab Manual 604

Vidya Vihar Institute of Technology


(BIADA Industrial Growth Centre ,Maranga, NH 31 Purnea , Bihar, India – 854301 )

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

6th SEMESTER
LAB MANUAL
SUBJECT CODE: 604
SESSION: 2019 – 2020

Prepared By:
Sanjay Kumar
(Assistant Professor, Department of Computer Science and Engineering)
Web Technology Lab Manual 604

LIST OF EXPERIMENTS:

Exp. No Title

1 Write an HTML program to create a List.

2 Write an HTML program to create a Table having random data.

3 Write an HTML program to create some windows controls for data input.

4 Write a program to demonstrate the creation of function in JavaScript.

5 Write a JavaScript code to validate a field on button click.

6 Write a program to demonstrate the use of AJAX.

7 Write a program to print a message from JSP page.

8 Write a program in JSP to show the use of exception handling.

9 Write a program in JSP to handle cookies in JSP.

10 Write a program in JSP to access a sample database using JDBC driver.


Web Technology Lab Manual 604

1. Write an HTML program to create a List.


Ans.

<html>
<head>
<title>VVIT – List Demo</title>
</head>
<body>
<ol>
<li>Static site
<ol type="a">
<li>HTML</li>
<li>CSS</li>
<li>JS</li>
</ol>
</li>
<li>Dynamic Site
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JS</li>
<li>Server Side Scripting
<ol type="i">
<li>PHP</li>
<li>JSP</li>
<li>ASP</li>

</ol>

</li>
</ul>
</li>
</ol>
</body>
</html>

2. Write an HTML program to create a Table having random data.

Ans.

<html>
<body>
<table border="1" bordercolor="#FF0000" align="center" width="300"
cellspacing="6" cellpadding="4">
<tr>
<td colspan="3">Student Details</td>

</tr>
<tr>
<th>Roll</th>
<th>Name</th>
<th>Marks</th>
Web Technology Lab Manual 604
</tr>

<tr>
<td>80812</td>
<td>Akshay</td>
<td>25</td>
</tr>

<tr>
<td>80813</td>
<td>Sumit Kumar</td>
<td>85</td>
</tr>

<tr>
<td>80814</td>
<td>Ravi Kumar</td>
<td>45</td>
</tr>
</table></body>
</html>

Q3. Write an HTML program to create some windows controls for data input.

Ans.

<html>
<body>
<h1 align="center">Windows All Controls Demo</h1>

<table align="center" width="472" border="0">


<tr>
<td width="244" align="left">Enter Name</td>
<td width="218"><input type="text"></td>
</tr>
<tr>
<td align="left">Enter Father's Name</td>
<td><input type="text"></td> </tr>
<tr>
<td align="left">Type your password</td>
<td><input type="password"></td>
</tr>
<tr>
<td align="left">Date of Birth</td>
<td><input type="date"></td>
</tr>
<tr>
<td align="left">Mobile No</td>
<td><input type="text"></td>
</tr>
<tr>
<td align="left">Email</td>
<td><input type="text"></td>
</tr>
Web Technology Lab Manual 604
<tr>
<td align="left">Gender</td>
<td><input type="radio" name="gender">Male<input type="radio"
name="gender">
Female<input type="radio" name="gender">Others
</td>
</tr>

<tr>
<td align="left">Hobbies</td>
<td><input type="checkbox">Sports<input type="checkbox">
Music<input type="checkbox">Others
</td>
</tr>

<tr>
<td align="left">Address</td>
<td><textarea rows="5" cols="22"></textarea>
</td>
</tr>

<tr>
<td align="left">Course</td>
<td>
<select>
<option>B. Tech</option>
<option>BCA</option>
<option>BBA</option>
<option>M. Tech</option>

<option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs
p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs
p;&nbsp;&nbsp;&nbsp;</option>
</select>
</td>
</tr>

<tr>
<td>Select Photo(.jpg,.png)</td>
<td align="left"><input type="file"></td>
</tr>

<tr>
<td>Upload Resume(.pdf,.docx)</td>
<td align="left"><input type="file"></td>
</tr>

<tr>
<td align="right">&nbsp;</td>
<td align="left">&nbsp;</td>
</tr>

<tr>
<td colspan="2"><input type="checkbox">I agree that above info........</td>
Web Technology Lab Manual 604

</tr>

<tr>
<td align="right">&nbsp;</td>
<td align="left">&nbsp;</td>
</tr>

<tr>
<td align="right"><input type="submit" value="Register"></td>
<td align="left"><input type="reset" value="Clear"></td>
</tr>
</table>
</body>
</html>

Q4. Write a program to demonstrate the creation of function in JavaScript.

Ans.
<html>
<head>
<script>
function fun()
{
alert("Hello from Javascript");
var fnum=document.getElementById("fnum").value;
var snum=document.getElementById("snum").value;
var res=Number(fnum)+Number(snum);
document.getElementById("res").value=res;
}

</script>
<body>
<table align="center" width="300" border="0">
<tr>
<td align="left">Enter First Number</td>
<td><input type="text" name="fnum" id="fnum"></td>
</tr>
<tr>
<td align="left">Enter Second Number</td>
<td><input type="text" name="snum" id="snum"></td> </tr>
<tr>
<td align="left">Result</td>
<td><input type="text" name="res" id="res"></td>
</tr>
<tr>
<td align="right"><input type="button" value="Add" onClick="fun()"></td>
<td align="left"><input type="reset" value="Clear"></td>
</tr>
</table>
</body>
</html>
Web Technology Lab Manual 604

Q5. Write a JavaScript code to validate a field on button click.


Ans.
<html>
<head>
<script>
function fun()
{
if(document.getElementById("fnum").value==””)
{
alert(“First number cannot be blank.”);
return 0;
}
if(document.getElementById("snum").value==””)
{
alert(“Second number cannot be blank.”);
return 0;
}

</script>
<body>
<table align="center" width="300" border="0">
<tr>
<td align="left">Enter First Number</td>
<td><input type="text" name="fnum" id="fnum"></td>
</tr>
<tr>
<td align="left">Enter Second Number</td>
<td><input type="text" name="snum" id="snum"></td> </tr>
<tr>
<td align="left">Result</td>
<td><input type="text" name="res" id="res"></td>
</tr>
<tr>
<td align="right"><input type="button" value="Add" onClick="fun()"></td>
<td align="left"><input type="reset" value="Clear"></td>
</tr>
</table>
</body>
</html>
Web Technology Lab Manual 604

Q6. Write a program to demonstrate the use of AJAX.


Ans.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script>
function validate()
{
if(document.getElementById("uid").value=="")
{
alert("Enter ID");

document.getElementById("uid").focus();
return false;
}
if(document.getElementById("pwd").value=="")
{
alert("Enter Password");

document.getElementById("pwd").focus();
return false;

var uid=document.getElementById("uid").value;
var pwd=document.getElementById("pwd").value;
xmlObj=new XMLHttpRequest();
xmlObj.onreadystatechange=function()
{
if(xmlObj.readyState==4 && xmlObj.status==200)
{

document.getElementById("error").innerHTML=xmlObj.responseText;
}
}

xmlObj.open("GET","login.php?uid=" + uid + "&pwd=" + pwd,true);

xmlObj.send();

}
</script>

<style>
.error
{
color:#F00;
font-size:16px;
}
</style>
</head>
Web Technology Lab Manual 604

<body>
<center>
User ID<input type="text" name="uid" id="uid" />
<br /><br />
Password<input type="password" name="pwd" id="pwd" />
<br /><br />
<input type="submit" value="Login" onclick="return validate()" />
<input type="reset" value="Clear" />
<div id="error" class="error"></div>
</center>
</body>
</html>

Q7. Write a program to print a message from JSP page.

Ans.

demo.jsp file

<html>
<head>
<title>JSP Demo</title>
</head>
<body>
<%
out.print(“Hello from JSP Block.”);
%>
</body>
</html>

Q8. Write a program in JSP to show the use of exception handling.

Ans.

<html>
<head>
<title>Try...Catch Example</title>
</head>

<body>
<%
try {
int i = 1;
i = i / 0;
out.println("The answer is " + i);
}
catch (Exception e) {
out.println("An exception occurred: " + e.getMessage());
}
%>
</body>
</html>
Web Technology Lab Manual 604

Q9. Write a program in JSP to handle cookies in JSP.

Ans.
<%
Cookie firstName = new Cookie("first_name",
request.getParameter("first_name"));
Cookie lastName = new Cookie("last_name",
request.getParameter("last_name"));

firstName.setMaxAge(60*60*24);
lastName.setMaxAge(60*60*24);

response.addCookie( firstName );
response.addCookie( lastName );
%>

<html>
<head>
<title>Setting Cookies</title>
</head>

<body>
<center>
<h1>Setting Cookies</h1>
</center>
<ul>
<li><p><b>First Name:</b>
<%= request.getParameter("first_name")%>
</p></li>
<li><p><b>Last Name:</b>
<%= request.getParameter("last_name")%>
</p></li>
</ul>

</body>
</html>

Q10. Write a program in JSP to access a sample database using JDBC driver.

Ans.
<%@ page import = "java.io.*,java.util.*,java.sql.*"%>
<%@ page import = "javax.servlet.http.*,javax.servlet.*" %>
Web Technology Lab Manual 604
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix = "c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix = "sql"%>

<html>
<head>
<title>SELECT Operation</title>
</head>

<body>
<sql:setDataSource var = "snapshot" driver = "com.mysql.jdbc.Driver"
url = "jdbc:mysql://localhost/TEST"
user = "root" password = "pass123"/>

<sql:query dataSource = "${snapshot}" var = "result">


SELECT * from Employees;
</sql:query>

<table border = "1" width = "100%">


<tr>
<th>Emp ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>

<c:forEach var = "row" items = "${result.rows}">


<tr>
<td><c:out value = "${row.id}"/></td>
<td><c:out value = "${row.first}"/></td>
<td><c:out value = "${row.last}"/></td>
<td><c:out value = "${row.age}"/></td>
</tr>
</c:forEach>
</table>

</body>
</html>

You might also like