Vehicle Registration
<html>
<head>
<title>Vehicle Registration</title>
<script type="text/javascript" scr="index.js" ></script>
</head>
<body>
<form id="registerVehicle" >
<h1>Motor Vehicle Department of Kerala</h1>
<hr>
<div id="registerDiv">
<h2>Vehicle Registration Form</h2>
<table id="vehicleForm" style="border:; 1px solid black; width: 80%; text-align: center; background-color:#EF45E0;">
<tr>
<td>Full name of Applicant</td>
<td>
<input type="text" required id="fullName" />
<span id="err1"></span>
</td>
</tr>
<tr>
<td>Age</td>
<td>
<input type="number" required id="age" />
<span id="err2"></span>
</td>
</tr>
<tr>
<td>Permanent Address</td>
<td>
<textarea required id="address"></textarea>
<span id="err3"></span>
</td>
</tr>
<tr>
<td>Contact Phone</td>
<td>
<input required type="text" id="phone" />
<span id="err4"></span>
</td>
</tr>
<tr>
<td>Class of vehicle</td>
<td>
<select id="vehClass">
<option value="Motorcycle With out Gear">Motorcycle With out Gear</option>
<option value="Motorcycle With Gear">Motorcycle With Gear</option>
<option value="Motor Car">Motor Car</option>
<option value="Light Motor Vehicle-Transport">Light Motor Vehicle-Transport</option>
</select>
<span id="err5"></span>
</td>
</tr>
<tr>
<td>Engine No</td>
<td>
<input type="number" id="engineNo"/>
<span id="err6"></span>
</td>
</tr>
<tr>
<td colspan="2">
<button type="submit" id="register" onclick="validateRegister();">Register</button>
<button type="reset" id="cancel">Cancel</button>
</td>
</tr>
</table>
</div>
</form>
<div id="resultDiv" style="display: none;">
<p>An event is created with id = <span id="eid"></span></p>
<p>Department :<span id="dep"></span></p>
<p>Status :<span id="sta"></span></p>
<p>Raised By :<span id="rai"></span></p>
<button id="close" onclick="show()">Close</button> </div>
</body>
</html>
js code:
function validateRegister() {
}
Event Mangement System
<html>
<head>
<title>Event Mangement System</title>
<script type="text/javascript" src="index.js"></script>
<style>
</style>
<head>
<body>
<!-- Design & Develop your code here
-->
<center>
<h1>Event Mangement System</h1>
<hr>
<div id="creationDiv">
<form name="createEvent" id="createEvent" method="post" action="index.js" onsubmit="return validateCreation()">
<h2>Event Creation Form</h2>
<table id="eventForm" align="center" width="80%" border="1px solid black" background-color="#FE45E0">
<tbody>
<tr>
<td><label>Event id</label></td>
<td><input type="number" name="eventId" required><span id="err1"></span></td>
</tr>
<tr>
<td><label>Department</label></td>
<td><input type="text" name="department" required><span id="err2"></span></td>
</tr>
<tr>
<td><label>Status</label></td>
<td>
<select name="status" required>
<option value="Open">Open</option>
<option value="In Progress">In Progress</option>
<option value="Rejected">Rejected</option>
<option value="Complete">Complete</option>
</select>
<span id="err3"></span>
</td>
</tr>
<tr>
<td><label>Description</label></td>
<td><input type="textarea" name="description" required><span id="err4"></span></td>
</tr>
<tr>
<td><label>Raised By</label></td>
<td><input type="text" name="raisedBy" required><span id="err5"></span></td>
</tr>
<tr>
<td><label>Contact Phone</label></td>
<td><input type="text" name="contactPhone" required><span id="err6"></span></td>
</tr>
<tr>
<td><button name="create" type="submit" value="create" style="background-color:#2345E4">Create</button></td>
<td><button name="cancel" type="reset" value="cancel" style="background-color:#2345E4">Cancel</button></td>
</tr>
</tbody>
</table>
</form>
<div id="resultDiv"></div>
</div>
</center>
</body>
</html>
index.js:
--------------
function validateCreation(){
var eventId=document.myform.eventId.value;
var department=document.myform.department.value;
var status=document.myform.status.value;
var option = status.options[status.selectedIndex].text;
var description=document.myform.description.value;
var raisedBy=document.myform.raisedBy.value;
var contactPhone=document.myform.contactPhone.value;
if (eventId===null || eventId===""){
document.getElementById("err1").innerHTML = "Invalid Entry";
return false;
}else if (department===null || department===""){
document.getElementById("err2").innerHTML = "Invalid Entry";
return false;
}else if (status===null || status===""){
document.getElementById("err3").innerHTML = "Invalid Entry";
return false;
}else if (description===null || description===""){
document.getElementById("err4").innerHTML = "Invalid Entry";
return false;
}else if (raisedBy===null || raisedBy===""){
document.getElementById("err5").innerHTML = "Invalid Entry";
return false;
}else if (contactPhone===null || contactPhone===""){
document.getElementById("err6").innerHTML = "Invalid Entry";
return false;
}else {
document.getElementById("resultDiv").innerHTML = "An event is created with event id ="
+ eventId + "<br> Department
:"
+ department + "<br> Status
:"
+ status + "<br> Raised By
:"
+ raisedBy + "<a href="index.html">[Close]</a>";
}
}
UI - CONTACT MANAGEMENT -
<!DOCTYPE html>
<html>
<head>
<title>.</title>
<style>
table,tr,th,td
{
border: 1px solid black;
border-collapse: collapse;
}
</style>
<script>
function func()
{
document.getElementById("message").innerHTML ="Customer Contact Created";
}
</script>
</head>
<body>
<h1 style="text-align: center;">ABC Hotels</h1>
<div id="message" onsubmit="func()">
<form name="contactCustomer" id="contactCustomer" >
<table id="contactTable" style="text-align: center;" width="30%" align="center">
<tr>
<th>Label</th>
<th>Control</th>
<th>Validation</th>
</tr>
<tr>
<td>Name</td>
<td><input type="text" name="name" placeholder="Customer Name"
maxlength="50" required= ></td>
<td>Mandatory,Max size=50</td>
</tr>
<tr>
<td>Age</td>
<td><input type="text" placeholder="Customer Age" name="age" min="20"
max="65" required></td>
<td>Mandatory,Value range 20-65</td>
</tr>
<tr>
<td>Email</td>
<td><input type="email" name="email" placeholder="Customer Email"></td>
<td>Mandatory,Valid Email</td>
</tr>
<tr>
<td>Address</td>
<td><input type="textarea" name="address" placeholder="Customer Address"></td>
<td>Mandatory</td>
</tr>
<tr>
<td>Phone</td>
<td><input type="text" name="phone" placeholder="Customer Phone"></td>
<td>Mandatory</td>
</tr>
<tr>
<td>Send</td>
<td><input type="submit" name="send" value="send" style="background-color:#fe45e4;" ></td>
<td></td>
</tr>
<tr>
<td>Cancel</td>
<td><input type="reset" name="reset" style="background-color:#fe45e4;"></td>
<td></td>
</tr>
</table>
</form>
</div>
</body>
</html>
UI - GRADE SIMPLE TASK
You have to first write in a .gradle file :-
apply plugin: 'java'
task(runSimple, dependsOn: 'classes', type: JavaExec) {
main = 'prime.java'
classpath = sourceSets.main.runtimeClasspath
}
defaultTasks 'runSimple'
Now in the folder prime.java you need to write the prime number code like that :-
class prime
{
public static void main (String[] args)
{
int i =0;
int num =0;
String prime = "";
for (i = 1; i <= 20; i++)
{
int counter=0;
for(num =i; num>=1; num--)
{
if(i%num==0)
{
counter = counter + 1;
}
}
if (counter ==2)
{
primeNumbers = prime + i + " ";
}
}
System.out.println(prime);
}
}
UI - VEHICLE MANAGEMENT
<html>
<head>
<title>Vehicle Registration</title>
<script type="text/javascript" scr="index.js" > </script>
</head>
<body>
<form id="registerVehicle">
<h1>Motor Vehicle Department of Kerala</h1>
<div id="registerDiv">
<h2>Vehicle Registration Form</h2>
</div>
<table style="border:; 1px solid black; width: 80%; text-align: center;
background-color:#EF45E0;" id="vehicle">
<tr>
<td>Full name of Applicant</td>
<td>
<input type="text" required id="fullName" />
<span id="err1"></span>
</td>
</tr>
<tr>
<td>Age</td>
<td>
<input type="number" required id="age" />
<span id="err2"></span>
</td>
</tr>
<tr>
<td>Permanent Address</td>
<td>
<textarea required id="address"></textarea>
<span id="err3"></span>
</td>
</tr>
<tr>
<td>Contact Phone</td>
<td>
<input required type="text" id="phone" />
<span id="err4"></span>
</td>
</tr>
<tr>
<td>Class of vehicle</td>
<td>
<select id="vehClass">
<option value="Motorcycle With out Gear">Motorcycle With out Gear</option>
<option value="Motorcycle With Gear">Motorcycle With Gear</option>
<option value="Motor Car">Motor Car</option>
<option value="Light Motor Vehicle-Transport">Light Motor Vehicle-Transport</option>
</select>
<span id="err5"></span>
</td>
</tr>
<tr>
<td>Engine No</td>
<td>
<input type="number" id="engineNo"/>
<span id="err6"></span>
</td>
</tr>
<tr>
<td colspan="2">
<button type="submit" id="register">Register</button>
<button type="reset" id="cancel">Cancel</button>
</td>
</tr>
</table>
</form>
<div id="resultDiv">Close</div>
</body>
</html>
Index.js :-
Function validateRegister() {
}
Contact List
<html>
<head>
<script
src="index.js"></script>
</head>
<body>
<table id="contactList"
border="1px" width="80%:" align="center">
<tr
style="background-color:#42aaf4">
<th>Phone
No.</th><th>Name</th><th>Gender</th><th>City</th><th>Action</th>
</tr>
<tr>
<td>9874563210</td><td>Akshay
Kumar</td><td>Male</td><td>Chennai</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
<tr>
<td>9632587410</td><td>Shyama
P</td><td>Female</td><td>Trivandrum</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
<tr>
<td>7896541230</td><td>Nalini
Kumari</td><td>Female</td><td>Banglore</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
<tr>
<td>9513571233</td><td>Raj
Shyam</td><td>Male</td><td>Chennai</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
<tr>
<td>8745632109</td><td>Sundar
G</td><td>Male</td><td>Manglore</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
<tr>
<td>7412580963</td><td>Kishore
P</td><td>Male</td><td>Calicut</td><td><input
type="Button" value="delete"
onclick="confirmDelete(this)"</td>
</tr>
</body>
</html>
Js:
function confirmDelete(o) {
var retVal = confirm("Do you want to Delete ?");
if( retVal == true ) {
deleteContact(o);
return true;
}
}
function deleteContact(o) {
var p=o.parentNode.parentNode;
p.parentNode.removeChild(p);
}
Hindusthan Liver:
-----------
<!DOCTYPE html>
<html>
<head>
<script src="shop.js"></script>
</head>
<body>
<div id="head"><h1>Hindustan Liver</h1></div>
<div id="body" name="body">
<h2>My Cart</h2>
<table id="myCarts" align="center" width="80%" border="1" name="myCarts">
<tr>
<th style="backgroud-color:#45E078">Product Name</th>
<th style="backgroud-color:#45E078">Description</th>
<th style="backgroud-color:#45E078">Unit Price</th>
<th style="backgroud-color:#45E078">Quantity</th>
<th style="backgroud-color:#45E078">Total</th>
<tr>
<tr>
<td>Surf Excel</td>
<td>Washing Powder</td>
<td>85.00</td>
<td><input type="number" id="item01" name="item01" onchange="calculateTotal('01')" value="1" /></td>
<td><span id="total01">85.00</span></td>
</tr>
<tr>
<td>Harpic</td>
<td>Toilet Cleaner</td>
<td>48.00</td>
<td><input type="number" id="item02" name="item02" onchange="calculateTotal('02')" value="2" /></td>
<td><span id="total02">96.00</span></td>
</tr>
<tr>
<td>Lux</td>
<td>Toilet Soap</td>
<td>36.00</td>
<td><input type="number" id="item03" name="item03" onchange="calculateTotal('03')" value="2" /></td>
<td><span id="total03">72.00</span></td>
</tr>
</table>
<div id="gtotal"></div>
<button id="continue" style="backgroud-color:#FF0000">Continue Shopping</button>
<button id="calculate" style="backgroud-color:#FF0000" onclick="calculateGrandTotal()">Calculate Total</button>
<footer>
<h4>(c) All rights reserved to Hindustan Liver 2018-2019</h4>
</footer>
</div>
</body>
</html>
index.js: (Hindusthan Liver) :
-----------------------------
function calculateTotal(id) {
var n = "item" + id;
var t = "total" + id;
var x = document.getElementById(n).value;
var total;
if (n.localeCompare("item01") == 0)
total = x * 85.00;
else if (n.localeCompare("item02") == 0)
total = x * 48.00;
else
total = x * 36.00;
var s = total + ".00";
document.getElementById(t).innerHTML = s;
}
function calculateGrandTotal() {
var x1 = parseFloat(document.getElementById("total01").innerHTML);
var x2 = parseFloat(document.getElementById("total02").innerHTML);
var x3 = parseFloat(document.getElementById("total03").innerHTML);
var total = x1 + x2 + x3;
var s = total + ".00";
document.getElementById("gtotal").innerHTML = s;
}
