Scribd
Upload
3 views33 pages

WT Lab Final

The document contains multiple HTML and XML examples, including a CSS demo page, a registration form with validation, and XML documents with internal and external DTDs for a bookstore and a ship order. The CSS demo showcases font styles, link styles, layers, and custom cursors. The XML sections define the structure for books and ship orders, including elements and attributes necessary for each document.

Uploaded by

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

WT Lab Final

The document contains multiple HTML and XML examples, including a CSS demo page, a registration form with validation, and XML documents with internal and external DTDs for a bookstore and a ship order. The CSS demo showcases font styles, link styles, layers, and custom cursors. The XML sections define the structure for books and ship orders, including elements and attributes necessary for each document.

Uploaded by

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

‭Set 2‬

‭ !DOCTYPE html>‬
<
‭<html>‬
‭<head>‬
‭<title>CSS Assignment</title>‬
‭<style>‬
‭/* 1. Font and Background Properties */‬
‭body {‬
‭font-family: 'Arial', sans-serif;‬
‭font-style: italic;‬
‭font-size: 18px;‬
‭background-image:‬
‭url('https://www.transparenttextures.com/patterns/brick-wall.png');‬
‭background-repeat: repeat;‬
‭background-color: #f0f8ff;‬
‭}‬

/‭* 3. Link Styles */‬


‭a:link {‬
‭color: blue;‬
‭text-decoration: none;‬
‭}‬

‭a:visited {‬
‭color: purple;‬
‭}‬

‭a:hover {‬
‭color: red;‬
‭text-decoration: underline;‬
‭}‬

‭a:active {‬
‭color: green;‬
‭}‬

/‭* 4. Layers Example */‬


‭.layer1 {‬
‭position: relative;‬
‭top: 0;‬
‭left: 0;‬
‭z-index: 2;‬
‭font-size: 50px;‬
‭color: black;‬
‭}‬

‭.layer2 {‬
‭position: relative;‬
‭top: -30px;‬
‭left: 10px;‬
‭z-index: 1;‬
‭font-size: 80px;‬
‭color: red;‬
‭}‬

/‭* 5. Custom Cursor */‬


‭.cursor-example {‬
‭cursor: crosshair;‬
‭padding: 20px;‬
‭border: 1px dashed gray;‬
‭margin-top: 20px;‬
‭}‬
‭</style>‬
‭</head>‬
‭<body>‬

‭<h1>Welcome to My CSS Demo</h1>‬

‭<p>This page demonstrates CSS font, background, link styles, layers, and custom‬
‭cursors.</p>‬

‭<a href="#">Visit My Page</a>‬

‭ !-- 4. Layer Example -->‬


<
‭<div class="layer1">LAYER 1</div>‬
‭<div class="layer2">LAYER 2</div>‬

‭ !-- 5. Cursor Example -->‬


<
‭<div class="cursor-example">‬
‭Hover here to see the custom cursor!‬
‭</div>‬

‭ /body>‬
<
‭</html>‬

‭Set-3‬

‭ !DOCTYPE html>‬
<
‭<html>‬
‭<head>‬
‭<title>Registration Form</title>‬
‭<style>‬
‭label {‬
‭display: block;‬
‭margin-top: 10px;‬
‭}‬
‭.error {‬
‭color: red;‬
‭font-size: 0.9em;‬
‭}‬
‭input, select, textarea {‬
‭margin-bottom: 5px;‬
‭}‬
‭</style>‬
‭</head>‬
‭<body>‬
‭<h2>Registration Form</h2>‬
‭<form onsubmit="return validateForm();">‬
‭<!-- Name -->‬
‭<label>Name:‬
‭ input type="text" id="name">‬
<
‭<div id="nameError" class="error"></div>‬
‭ /label>‬
<

‭ !-- Password -->‬


<
‭<label>Password:‬
‭<input type="password" id="password">‬
‭<div id="passwordError" class="error"></div>‬
‭</label>‬

‭ !-- Email -->‬


<
‭<label>Email:‬
‭<input type="text" id="email">‬
‭<div id="emailError" class="error"></div>‬
‭</label>‬

‭ !-- Phone -->‬


<
‭<label>Phone Number:‬
‭<input type="text" id="phone">‬
‭<div id="phoneError" class="error"></div>‬
‭</label>‬

‭ !-- Gender -->‬


<
‭<label>Sex:‬
‭<input type="radio" name="gender" value="Male"> Male‬
‭<input type="radio" name="gender" value="Female"> Female‬
‭</label>‬

‭ !-- DOB -->‬


<
‭<label>Date of Birth:‬
‭<select id="dob-day">‬
‭<option value="">Day</option>‬
‭<script>‬
‭for(let d=1; d<=31; d++) {‬
‭document.write(`<option value="${d}">${d}</option>`);‬
‭}‬
‭</script>‬
‭</select>‬
‭<select id="dob-month">‬
‭<option value="">Month</option>‬
‭<option>Jan</option><option>Feb</option><option>Mar</option>‬
‭<option>Apr</option><option>May</option><option>Jun</option>‬
‭<option>Jul</option><option>Aug</option><option>Sep</option>‬
‭<option>Oct</option><option>Nov</option><option>Dec</option>‬
‭</select>‬
‭<select id="dob-year">‬
‭<option value="">Year</option>‬
‭<script>‬
‭for(let y = 2024; y >= 1950; y--) {‬
‭document.write(`<option value="${y}">${y}</option>`);‬
‭}‬
‭</script>‬
‭</select>‬
‭</label>‬
‭ !-- Languages -->‬
<
‭<label>Languages Known:‬
‭<input type="checkbox" name="lang" value="English"> English‬
‭<input type="checkbox" name="lang" value="Telugu"> Telugu‬
‭<input type="checkbox" name="lang" value="Hindi"> Hindi‬
‭<input type="checkbox" name="lang" value="Tamil"> Tamil‬
‭</label>‬

‭ !-- Address -->‬


<
‭<label>Address:‬
‭<textarea id="address" rows="4" cols="30"></textarea>‬
‭</label>‬

‭ br>‬
<
‭<input type="submit" value="Register">‬
‭ /form>‬
<

‭<script>‬
‭function validateForm() {‬
‭let valid = true;‬

‭ onst name = document.getElementById("name").value.trim();‬


c
‭const password = document.getElementById("password").value;‬
‭const email = document.getElementById("email").value.trim();‬
‭const phone = document.getElementById("phone").value.trim();‬

/‭/ Clear previous error messages‬


‭document.getElementById("nameError").innerText = "";‬
‭document.getElementById("passwordError").innerText = "";‬
‭document.getElementById("emailError").innerText = "";‬
‭document.getElementById("phoneError").innerText = "";‬

/‭/ Name validation‬


‭if (!/^[A-Za-z]{6,}$/.test(name)) {‬
‭document.getElementById("nameError").innerText = "Name must be at least 6‬
‭alphabetic characters.";‬
‭valid = false;‬
‭}‬

/‭/ Password validation‬


‭if (password.length < 6) {‬
‭document.getElementById("passwordError").innerText = "Password must be at‬
‭least 6 characters long.";‬
‭valid = false;‬
‭}‬

/‭/ Email validation‬


‭const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;‬
‭if (!emailPattern.test(email)) {‬
‭document.getElementById("emailError").innerText = "Please enter a valid email‬
‭address.";‬
‭valid = false;‬
‭}‬
/‭/ Phone validation‬
‭if (!/^\d{10}$/.test(phone)) {‬
‭document.getElementById("phoneError").innerText = "Phone number must be‬
‭exactly 10 digits.";‬
‭valid = false;‬
‭}‬

‭return valid;‬
‭}‬
‭ /script>‬
<
‭</body>‬
‭</html>‬

‭ et-4‬
S
‭Create XML document and internal and external DTD for bookstore‬
‭Elements:‬
‭Book,title,author, publisher, description,price,stock,genre.‬
‭Attributes:‬
‭Language, currency,date of publication.‬

‭Xml document with internal dtd‬

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

‭<!DOCTYPE bookstore [‬

‭<!ELEMENT bookstore (book+)>‬

‭<!ELEMENT book (title, author, publisher, description, price, stock, genre)>‬

‭<!ATTLIST book‬

‭language CDATA #REQUIRED‬

‭currency CDATA #REQUIRED‬

‭dateOfPublication CDATA #REQUIRED‬

‭>‬

‭<!ELEMENT title (#PCDATA)>‬

‭<!ELEMENT author (#PCDATA)>‬

‭<!ELEMENT publisher (#PCDATA)>‬

‭<!ELEMENT description (#PCDATA)>‬

‭<!ELEMENT price (#PCDATA)>‬

‭<!ELEMENT stock (#PCDATA)>‬

‭<!ELEMENT genre (#PCDATA)>‬

‭]>‬
‭<bookstore>‬

‭<book language="English" currency="USD" dateOfPublication="2022-08-15">‬

‭<title>The Alchemist</title>‬

‭<author>Paulo Coelho</author>‬

‭<publisher>HarperOne</publisher>‬

‭<description>A novel about following your dreams.</description>‬

‭<price>15.99</price>‬

‭<stock>120</stock>‬

‭<genre>Fiction</genre>‬

‭</book>‬

‭<book language="English" currency="USD" dateOfPublication="2020-03-12">‬

‭<title>Atomic Habits</title>‬

‭<author>James Clear</author>‬

‭<publisher>Avery</publisher>‬

‭<description>Practical strategies for forming good habits.</description>‬

‭<price>11.50</price>‬

‭<stock>85</stock>‬

‭<genre>Self-help</genre>‬

‭</book>‬

‭</bookstore>‬

‭External dtd (bookstore.dtd)‬

‭<!ELEMENT bookstore (book+)>‬

‭<!ELEMENT book (title, author, publisher, description, price, stock, genre)>‬

‭<!ATTLIST book‬

‭language CDATA #REQUIRED‬

‭currency CDATA #REQUIRED‬

‭dateOfPublication CDATA #REQUIRED‬

‭>‬
‭<!ELEMENT title (#PCDATA)>‬

‭<!ELEMENT author (#PCDATA)>‬

‭<!ELEMENT publisher (#PCDATA)>‬

‭<!ELEMENT description (#PCDATA)>‬

‭<!ELEMENT price (#PCDATA)>‬

‭<!ELEMENT stock (#PCDATA)>‬

‭<!ELEMENT genre (#PCDATA)>‬

‭Xml document‬

‭ ?xml version="1.0" encoding="UTF-8"?>‬


<
‭<!DOCTYPE bookstore SYSTEM "bookstore.dtd">‬
‭<bookstore>‬
‭<book language="English" currency="USD" dateOfPublication="2021-11-05">‬
‭<title>Clean Code</title>‬
‭<author>Robert C. Martin</author>‬
‭<publisher>Prentice Hall</publisher>‬
‭<description>Handbook of Agile Software Craftsmanship.</description>‬
‭<price>40.00</price>‬
‭<stock>55</stock>‬
‭<genre>Programming</genre>‬
‭</book>‬
‭</bookstore>‬

‭ et-5: xml schema‬


S
‭Create xml for ship order‬
‭Elements:‬
‭Orderid‬
‭Customer‬
‭Items‬
‭Item‬
‭Price‬
‭ShipTo‬
‭Quantity‬
‭Shippingplace‬
‭Attributes:‬
‭Order date‬
‭Deliver date‬

‭Xml document(shiporder.xml)‬

‭ ?xml version="1.0" encoding="UTF-8"?>‬


<
‭<shiporder‬
‭xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"‬
‭xsi:noNamespaceSchemaLocation="shiporder.xsd"‬
‭orderdate="2025-05-01"‬
‭deliverydate="2025-05-10">‬
‭ orderid>ORD12345</orderid>‬
<
‭<customer>John Doe</customer>‬
‭<items>‬
‭<item>‬
‭<name>Wireless Mouse</name>‬
‭<price>25.99</price>‬
‭<quantity>2</quantity>‬
‭</item>‬
‭<item>‬
‭<name>Keyboard</name>‬
‭<price>45.00</price>‬
‭<quantity>1</quantity>‬
‭</item>‬
‭</items>‬
‭<shipto>‬
‭<shippingplace>New York, USA</shippingplace>‬
‭</shipto>‬
‭ /shiporder>‬
<

‭Xml schema (shiporder.xsd)‬

‭ ?xml version="1.0" encoding="UTF-8"?>‬


<
‭<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">‬

‭<xs:element name="shiporder">‬
‭<xs:complexType>‬
‭<xs:sequence>‬
‭<xs:element name="orderid" type="xs:string"/>‬
‭<xs:element name="customer" type="xs:string"/>‬
‭<xs:element name="items">‬
‭<xs:complexType>‬
‭<xs:sequence>‬
‭<xs:element name="item" maxOccurs="unbounded">‬
‭<xs:complexType>‬
‭<xs:sequence>‬
‭<xs:element name="name" type="xs:string"/>‬
‭<xs:element name="price" type="xs:decimal"/>‬
‭<xs:element name="quantity" type="xs:positiveInteger"/>‬
‭</xs:sequence>‬
‭</xs:complexType>‬
‭</xs:element>‬
‭</xs:sequence>‬
‭</xs:complexType>‬
‭</xs:element>‬
‭<xs:element name="shipto">‬
‭<xs:complexType>‬
‭<xs:sequence>‬
‭<xs:element name="shippingplace" type="xs:string"/>‬
‭</xs:sequence>‬
‭</xs:complexType>‬
‭</xs:element>‬
‭</xs:sequence>‬
‭<xs:attribute name="orderdate" type="xs:date" use="required"/>‬
‭<xs:attribute name="deliverydate" type="xs:date" use="required"/>‬
‭ /xs:complexType>‬
<
‭</xs:element>‬

‭</xs:schema>‬

‭ et-6‬
S
‭visual beans‬

‭Shapebean.java‬

i‭mport javax.swing.*;‬
‭import java.awt.*;‬
‭import java.awt.event.*;‬
‭import java.util.Random;‬

‭public class ShapeBean extends JPanel {‬


‭private boolean shape = true; // true = Square, false = Circle‬
‭private Color currentColor;‬

‭public ShapeBean() {‬
‭currentColor = getRandomColor();‬

/‭/ Change color on mouse click‬


‭addMouseListener(new MouseAdapter() {‬
‭public void mouseClicked(MouseEvent e) {‬
‭currentColor = getRandomColor();‬
‭repaint();‬
‭}‬
‭});‬

‭setPreferredSize(new Dimension(200, 200));‬


‭}‬

/‭/ Property method to set shape‬


‭public void setShape(boolean shape) {‬
‭this.shape = shape;‬
‭repaint();‬
‭}‬

/‭/ Property method to get current shape‬


‭public boolean isShape() {‬
‭return shape;‬
‭}‬

/‭/ Generate random color‬


‭private Color getRandomColor() {‬
‭Random rand = new Random();‬
‭return new Color(rand.nextInt(256), rand.nextInt(256), rand.nextInt(256));‬
‭}‬

‭ Override‬
@
‭protected void paintComponent(Graphics g) {‬
‭ uper.paintComponent(g);‬
s
‭g.setColor(currentColor);‬

i‭nt width = getWidth() - 50;‬


‭int height = getHeight() - 50;‬
‭int x = 25, y = 25;‬

‭if (shape) {‬
‭g.fillRect(x, y, width, height); // Draw square‬
‭} else {‬
‭g.fillOval(x, y, width, height); // Draw circle‬
‭}‬
‭}‬
‭}‬

‭testBeanapp.java‬

‭import javax.swing.*;‬

‭public class TestBeanApp {‬


‭public static void main(String[] args) {‬
‭JFrame frame = new JFrame("Shape Bean Example");‬
‭ShapeBean bean = new ShapeBean();‬

/‭/ Set shape manually:‬


‭bean.setShape(true); // true for square, false for circle‬

f‭rame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);‬
‭frame.add(bean);‬
‭frame.pack();‬
‭frame.setVisible(true);‬
‭}‬
‭}‬
‭ et-7‬
S
‭write a servelt registration form which contain fields (fbame, mname, lname, email,‬
‭password,age,gender) and display it‬
‭ et-8‬
S
‭Write a servlet about reading init parameters using web.xml( font-size, database usage ,‬
‭username and password) and display‬
‭ et-9‬
S
‭Write a servlet code to Read context parameter from a web.xml file having contextServlet1,‬
‭contextServlet2 (database name,username, password) and display them‬
‭ et-10‬
S
‭Sessions‬
‭Set -11‬

‭Armstrong number‬

‭Perfect number‬
‭Prime number‬

‭ et-12‬
S
‭1)wap to calculate total salary basing on inputs taken from user like designation of‬
‭employee,basing on designation you must calculate net salary .‬
‭2)demo on different JSP page directives and predefined libraries.‬
‭ et-13‬
S
‭:jdbc connection jsp/servlet create a database with atleast name, password,phone,email.‬

‭Database‬

‭CREATE DATABASE studentDB;‬

‭USE studentDB;‬

‭CREATE TABLE users (‬


‭id INT AUTO_INCREMENT PRIMARY KEY,‬
‭name VARCHAR(50),‬
‭password VARCHAR(50),‬
‭phone VARCHAR(15),‬
‭email VARCHAR(100)‬
‭);‬

I‭NSERT INTO users (name, password, phone, email) VALUES‬


‭('John', 'john123', '9876543210', '[email protected]'),‬
‭('Alice', 'alice456', '8765432109', '[email protected]');‬

‭Jsp code‬

‭ %@ page import="java.sql.*" %>‬


<
‭<html>‬
‭<head><title>Display Users</title></head>‬
‭<body>‬
‭<h2>Registered Users</h2>‬
‭<table border="1">‬
‭<tr>‬
‭<th>Name</th>‬
‭<th>Password</th>‬
‭ th>Phone</th>‬
<
‭<th>Email</th>‬
‭ /tr>‬
<

‭<%‬
‭String url = "jdbc:mysql://localhost:3306/studentDB";‬
‭String user = "root"; // change if needed‬
‭String pass = ""; // your MySQL password‬

‭try {‬
‭Class.forName("com.mysql.cj.jdbc.Driver");‬
‭Connection con = DriverManager.getConnection(url, user, pass);‬
‭Statement stmt = con.createStatement();‬

/‭/ Try different queries here‬


‭ResultSet rs = stmt.executeQuery("SELECT * FROM users");‬

‭while(rs.next()) {‬
‭ >‬
%
‭<tr>‬
‭<td><%= rs.getString("name") %></td>‬
‭<td><%= rs.getString("password") %></td>‬
‭<td><%= rs.getString("phone") %></td>‬
‭<td><%= rs.getString("email") %></td>‬
‭</tr>‬
‭<%‬
‭}‬
‭con.close();‬
‭} catch(Exception e) {‬
‭out.println("Error: " + e.getMessage());‬
‭}‬
‭%>‬
‭</table>‬
‭</body>‬
‭</html>‬
‭ et-14‬
S
‭Cookies‬
‭ et-15‬
S
‭Create tables in the database which contain the details of items (books in our case like‬
‭Bookname , 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.‬

‭Data base‬

‭CREATE DATABASE bookDB;‬

‭USE bookDB;‬

‭CREATE TABLE books (‬


‭id INT PRIMARY KEY AUTO_INCREMENT,‬
‭bookname VARCHAR(100),‬
‭author VARCHAR(100),‬
‭publisher VARCHAR(100),‬
‭price DECIMAL(10,2),‬
‭quantity INT,‬
‭amount DECIMAL(10,2),‬
‭cover_image VARCHAR(255) -- image path or URL‬
‭);‬

-‭ - Sample data‬
‭INSERT INTO books (bookname, author, publisher, price, quantity, amount, cover_image)‬
‭VALUES‬
‭('Java Basics', 'John Doe', 'TechBooks', 299.99, 10, 2999.90, 'images/java.jpg'),‬
‭('HTML & CSS', 'Jane Smith', 'WebBooks', 199.99, 5, 999.95, 'images/htmlcss.jpg');‬

‭Jsp code‬

‭ %@ page import="java.sql.*" %>‬


<
‭<html>‬
‭<head><title>Book Catalogue</title></head>‬
‭<body>‬
‭<h2>Book Catalogue</h2>‬
‭<table border="1" cellpadding="10">‬
‭<tr>‬
‭<th>Cover</th>‬
‭<th>Book Name</th>‬
‭<th>Author</th>‬
‭<th>Publisher</th>‬
‭<th>Price</th>‬
‭<th>Add to Cart</th>‬
‭</tr>‬

‭<%‬
‭String url = "jdbc:mysql://localhost:3306/bookDB";‬
‭ tring user = "root"; // change as needed‬
S
‭String pass = ""; // your MySQL password‬

‭try {‬
‭Class.forName("com.mysql.cj.jdbc.Driver");‬
‭Connection con = DriverManager.getConnection(url, user, pass);‬
‭Statement stmt = con.createStatement();‬
‭ResultSet rs = stmt.executeQuery("SELECT * FROM books");‬

‭while(rs.next()) {‬
‭ >‬
%
‭<tr>‬
‭<td><img src="<%= rs.getString("cover_image") %>" width="100"/></td>‬
‭<td><%= rs.getString("bookname") %></td>‬
‭<td><%= rs.getString("author") %></td>‬
‭<td><%= rs.getString("publisher") %></td>‬
‭<td>₹<%= rs.getDouble("price") %></td>‬
‭<td><form><button type="submit">Add to Cart</button></form></td>‬
‭</tr>‬
‭<%‬
‭}‬
‭con.close();‬
‭} catch(Exception e) {‬
‭out.println("Database Error: " + e.getMessage());‬
‭}‬
‭%>‬
‭</table>‬
‭</body>‬
‭</html>‬

You might also like