Final Project

Account_Search
<!DOCTYPE html>
<html>
<style>
.AccountSearch{
border-radius: 4px;
width: 40%;
height: 100%;
size: 50px;
background-color: lightgray;
margin-left: 35%;
margin-top: 15%;
}
h2 {
background-color: gray;
text-align: center;
}
label {
display: inline-block;
width: 150px;
text-align: left;
}
button {
button-align: center;
margin:9%;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
</style>
<head>
<link rel="stylesheet" href="Account_Search.css">
</head>
<body>
<div class="AccountSearch">
<h2>Account Search</h2>
<form name="myForm" align="center">
<table align="center" width="30%" height="60%" >
<tr>
<td>
<font size="-1"><label >Enter Account ID: </label></font>
</td>
<td>
<input type="number" id="AccountId" name="AccountId"><br>
</td>
<tr><td align="center" colspan="2"><label>OR</label></td></tr>
</tr>
<tr>
<td><font size="-1"><label>Enter Customer ID: </label></font>
</td>
<td> <input type="number" id="CustomerId" name="CustomerId"
maxlength="9" ><br> </td>
</tr>
<tr>
<td colspan="2 " align="center">
<button type="submit" value="Submit"
onclick="myFunc(document.myForm.AccountId,9,9)">View</button>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
<script>
function myFunc(inputtxt,minlength,maxlength)
{
var field = inputtxt.value;
var mnlen = minlength;
var mxlen = maxlength;
if(field.length<mnlen || field.length> mxlen)

{
alert("Please enter a valid Account/Customer ID of 9 characters");
return false;
}
else{
window.location.href="Account_Statement.html";
}
}
</script>
Account_Statemetn
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.update{
text-align:center;
}
.footer
{

width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
}
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
text-decoration:none;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
background-color:black;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
background:lightgrey;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-family:Century Gothic;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
background-color:white;
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
border:2px solid black;
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<b style="color: #FFCC00"> Federal </b>
<b style="color: white"> Bank</b><br></h3>
<div class="nav" align="center">
<ul>
<li><a class="active" href="#">Home</a></li>
<li>
<a href="#">Account Details</a>
<ul>
<li><a href="Deposit_Money.html">Deposit
Money</a></li>
<li><a href="Transfer_Money.html">Transfer
Money</a></li>
<li><a href="WithdrawMoney.html">Withdraw
Money</a></li>
</ul>
</li>
<li>
<a href="#">Account Statement </a>
<ul>
<li><a href="Account_Statement.html">Account
Statement</a></li>
</ul>
</li>
<li>
<a href="#">Search</a>
<ul>
<li><a href="Customer_Search.html">Customer
Search</a></li>
<li><a href="Account_Search.html">Account
Search</a></li>
</ul>
</li>
<li><a href="#">logout</a></li>
</ul>
</div>
<footer class="footer">

<div class="About">
<h3>About Us</h3>
<p style="font-size:14px">FedChoice bank was Founded on 14th june
2016 with the objective of providing<br>with the detail service based on Retail
banking operations.</p>
</div>
<div class="Service">
<h3>Services</h3>
<p style="font-size:14px">Retail and Customer banking<br>Personal
Internet banking<br>Corporate Internate banking<br>Debit and credit cards</p>
</div>
<div class="Contact">
<h3>Contact Us</h3>
<p style="font-
size:14px">Email:Customer.service@fedchoice.com<br>
Contact No:0224454577,02254545566<br>Address:Corporate
Office,Madame Cama Road<br>Nariman Point
,Mumbai,Maharashtra 400021</p>
</div>


</footer>
<div class="update">
<h2><b>Account Statement</b></h2><br>
<form name = "form1" action="">
<div>
<div id="op"><label for="accid">Account Id:</label>
<span class="acc"><input type="number" id="accid" name="accid"
value="111011060"/></span>

<label for="transaction">Transactions:</label>
<input type="number" id="transaction" name="transaction" value=""
required><br><br>
</div>
<div class="last">
<div>
<input type="radio" id="css" name="fav_language" value="CSS">
<label for="html">Last Number of Transactions</label><br>
</div>

<div class="start">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="css">Start-End Dates</label><br><br>
</div>
</div>
onclick="stringlength(document.form1.accid,document.form1.transaction,9,9)">Submit<
/button>
</form>
</div>
</body>
</html>
<script>
function stringlength(inputtxt,a, minlength, maxlength)
{
var b=a.value;

{
alert("Please input the userid of 9 characters");
return false;
}
else if(b.length<1){
alert("Enter Number of Transactions");
}
else
{
alert('Statement will be loaded soon..');
return true;
}
}
</script>
<!DOCTYPE html>
<html>
<head>
<style>
.update{
text-align:center;
}
#you{
position:relative;
left:-37px;}
.center {
margin-left: auto;
margin-right: auto;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<div class="nav">
<ul>
<li>
<a href="#">Customer Mgt.</a>
<ul>
<li><a href="Create_Customer.html"
target="_self">Create Customer</a></li>
<li><a href="Update.html">Update Customer</a></li>
<li><a href="Delete_Customer.html">Delete Customer</a></li>
</ul>
</li>
<li>
<a href="#">Account Mgt.</a>
<ul>
<li><a href="Create_Account.html">Create Account</a></li>
<li><a href="Delete_Account.html">Delete Account</a></li>
</ul>
</li>
<li>
<a href="#">Status Details </a>
<ul>
<li><a href="Customer_Status.html">Customer
Status</a></li>
<li><a href="Account_Status.html">Account Status</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer><br>
<h2><b>Account Status</b></h2><br>
</div>
<table align="center" border="2" cellspacing="0" cellpadding="4">

<tr bgcolor="yellow">
<td><b>Customer ID</b></td>
<td><b>Account ID</td>
<td><b>Account Type</b></td>
<td><b>Account Status</b></td>
<td><b>Message</b></td>
<td><b>Last Updated</b></td>
<td><b>Operations</b></td>
</tr>
<tr>
<td>10000025B</td>
<td>0</td>
<td>Current</td>
<td>Pending</td>
<td></td>
<td><a href="#"></a></td>
<td><a href="#">Refresh</a></td>
</tr>
<tr>
<td>10000026T</td>
<td>111011059</td>
<td>Savings</td>
<td>Active</td>
<td>account creation complete</td>
<td>2016-03-31 10:38:30</td>
</tr>
<tr>
<td>10000026G</td>
<td>111011150</td>
<td>Current</td>
<td>Active</td>
<td>Customer already has account of specified type</td>
<td>2016-01-12 16:30:55</td>
</tr>
<tr>
<td>10000025B</td>
<td>111011060</td>
<td>Savings</td>
<td>Active</td>
<td>Customer already has account of specified type</td>
<td>2016-01-12 16:30:56</td>
</tr>
</table>
</body>
<br>
<div align="center"><a href="Account_Status.html"><input type="submit"
value="Refresh the list"></a></div>
<br><br>
</body>
</html>
Create Acciunt
<!DOCTYPE html>
<html>
<head>
<style>
.update{
text-align:center;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<b style="color: #FFCC00"> Federal</b>
<div class="nav">
<ul>
<li>
<ul>
</ul>
</li>
<li>
<ul>
</ul>
</li>
<li>
<ul>
Status</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<br><br>
<label for="cid">Customer Id:</label>
<input type='text' id='cid' required /><br>

<label for="acc">Account Selection:</label>
<select name="acc" name="acc">

<option value="sav">Savings Account</option>
<option value="curr">Current Account</option>
</select><br>
<label for="lname">Deposit Amt:</label>

<input type="number" id="lname" name="lname" value=""><br><br>
onclick="stringlength(document.form1.cid,document.form1.lname,9,9)">Submit</button>
</form>
</div>
</body>
</html>
<script>
function stringlength(inputtxt, a,minlength, maxlength)
{
var b=a.value;
{
return false;
}
else if(b.length<1){
alert("Enter Deposit Amount");
return false;
}
else
{
alert('Account creation initiated successfully');
return true;
}
}
</script>
Creaste_Customer
<!DOCTYPE html>
<html>
<head>
<style>
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
.left{
margin-left: 10px;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<div class="nav">
<ul>
<li>
<ul>
<li><a href="Update.html">Update
Customer</a></li>
<li><a href="Delete_Customer.html">Delete
Customer</a></li>
</ul>
</li>
<li>
<ul>
<li><a href="Create_Account.html">Create
Account</a></li>
<li><a href="Delete_Account.html">Delete
Account</a></li>
</ul>
</li>
<li>
<ul>
<li><a
href="Customer_Status.html">Customer
Status</a></li>
<li><a
href="Account_Status.html">Account Status</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<div style="text-align:center;">
<form name="myForm">
<br>
<label for="myText">Customer SSN Id:</label>

<input class="left" type="number" id="lop" name="hi" required=""><br>
<label style="margin-right: 20px;" for="lname">Customer Name:</label>
<input class="left1" type="text" id="cn" onkeydown="return
/[a-zA-Z]/i.test(event.key)" required><br>
<label style="margin-right: 10px;" for="age">Age (in numbers):</label>
<input class="left2" type="number" id="ageof" name="age" value=""
onkeydown="return /[0-
9xxxxxxxxx]/i.test(event.key)" required><br>
<label style="margin-right: 25px;" for="address">Address Line 1:</label>
<input class="left3" type="text" id="addressof" name="address"
onkeydown="return /[a-zA-Z0-9]/i.test(event.key)" required><br>
<label style="margin-right: 90px;" for="state">State:</label>

<select style="margin-right: 68px;" class="left4" name="state" id="state">
<option value="jk">J&K</option>
<option value="punjab">Punjab</option>
<option value="haryana">Haryana</option>
<option value="up">Uttar Pradesh</option>
</select>
<br>
<label style="margin-right: 94px;" for="city">City:</label>
<select style="margin-right: 83px;" class="left5" name="city" id="city">
<option value="jammu">Jammu</option>
<option value="delhi">Delhi</option>
<option value="chandigarh">Chandigarh</option>
</select>
<br><br>
onclick="stringlength(document.myForm.lop,document.myForm.cn,document.myForm.ageof,
document.myForm.addressof,9,9)" "="">Submit</button>
</form>
</div>
</body>
</html>
<script>
function stringlength(inputtxt,a,b,c, minlength, maxlength)
{
var d=a.value;
var e=b.value;
var f=c.value;

{
return false;
}
else if(e.length>3){
alert('Enter Correct Age');
return false;
}
else if(d.length>0 && e.length>0 && f.length>0)
{
alert('Customer creation initiated successfully');
return true;
}
}
</script>
Customer zSearch
<!DOCTYPE html>
<html>
<style>
.CustomerSearch{
border-radius: 4px;
width: 40%;
height: 100%;
size: 50px;
background-color: lightgray;
margin-left: 35%;
margin-top: 15%;
}
h2 {
text-align: center;
}
label {
display: inline-block;
width: 150px;
text-align: left;
}
button {
button-align: center;
margin:9%;
}
margin: 0;
}
</style>
<head>
//<link rel="stylesheet" href="Customer_Search.css">
</head>
<body>
<div class="CustomerSearch">
<h2>Customer Search</h2>
<form name="form1" action="site.cccmk" align="center">
<table align="center" width="30%" height="60%" >
<tr>
<td>
<font size="-1"><label>Enter SSN ID: </label></font>
</td>
<td>
<input type="text" id="ssnid" name="ssnid" pattern="\d*"
maxlength="9"><br>
</td>
<tr><td align="center" colspan="2"><label>OR</label></td></tr>
</tr>
<tr>
<td><font size="-1"><label>Enter Customer ID: </label></font>
</td>
<td> <input type="text" pattern="\d*" maxlength="9"><br> </td>
</tr>
<tr>
<td colspan="2 " align="center"> 
<button type="button" value="View"
onclick="stringlength(document.form1.ssnid,9,9)">View</button>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
<script>
function stringlength(inputtxt, minlength, maxlength)
{

{
alert("Please enter a valid SSN/Customer ID of 9 characters");
return false;
}
else{
}
}
</script>
Cust status
<!DOCTYPE html>
<html>
<head>
<style>
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height: 50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
table {
border:4x solid red;

font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
margin-top:10px;
margin-bottom:10px;
}
td, th {
border: 4px solid #dddddd;
text-align: left;
padding: 8px;
text-align:center;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<div class="nav">
<ul>
<li>
<ul>
</ul>
</li>
<li>
<ul>
</ul>
</li>
<li>
<ul>
Status</a></li>
</ul>
</li>
</ul>
</div>
<br>
<h2 align="center" style="font-size:2.5em; color:DodgerBlue;">Customer
Status</h2>
<table style="align:center;">
<tr style="background: yellow;">
<th>Customer Id</th>
<th>Customer SSN ID</th>
<th>Status</th>
<th>Message</th>
<th>Last Updated</th>
<th>Operations</th>
<th>View Profile</th>
</tr>
<tr>
<td>100000625</td>
<td>800000012</td>
<td>Active</td>
<td>customer update complete</td>
<td>2016-06-24 15:59:51</td>
<td><a href="Customer_Status.html">Refresh</a></td>
<td><a href="#" target="_blank">View Details</a></td>
</tr>
<tr>
<td>100000632</td>
<td>800000019</td>
<td>Active</td>
<td>customer created successfully</td>
<td>2016-06-21 14:27:39</td>
</tr>
<tr>
<td>100000266</td>
<td>800000002</td>
<td>Active</td>
<td>customer reactivation success</td>
<td>2016-06-21 14:27:35</td>
</tr>
<tr>
<td>0</td>
<td>801010111</td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>100000265</td>
<td>800000001</td>
<td>Active</td>
<td>customer is already active</td>
<td>2016-06-21 14:27:35</td>
</tr>
<tr>
<td>100000267</td>
<td>800000003</td>
<td>Active</td>
<td>customer update complete</td>
<td>2016-06-24 15:59:51</td>
</tr>
<tr>
<td>100000267</td>
<td>800000004</td>
<td>Active</td>
<td>customer is already active</td>
<td>2016-06-24 15:59:37</td>
</tr>
<tr>
<td>100000267</td>
<td>800000003</td>
<td>Active</td>
<td>customer created successfully</td>
<td>2016-06-21 14:27:38</td>
</tr>
</table>
</body>
</html>
Delete Accouint
<!DOCTYPE html>
<html>
<head>
<style>
.update{
text-align:center;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<div class="nav">
<ul>
<li>
<ul>
</ul>
</li>
<li>
<ul>
</ul>
</li>
<li>
<ul>
Status</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<br>
<h2><b>Delete Account</b></h2>
<br><br>
<label for="cars">Account Id:</label>
<select name="acc" id="acc">

<option value="accid1">111011059</option>
</select><br><br>
<label for="acctype">Account Type:</label>
<select name="acctype" id="acctype">
<option value="curr">Current</option>
<option value="sav">Savings</option>
</select><br><br>
<button type="submit" value="Submit" onclick="stringlength()">Delete
Account</button>
</form>
</div>
</body>
</html>
<script>
{
alert("Account deletion initiated successfully");
</script>
Delete customer
<!DOCTYPE html>
<html>
<head>
<style>
.update{
padding:70px;
}
margin: 0;
}
.first{
/* border: 2px solid red; */
display: flex;
align-items: center;
justify-content: center;
}
.sec{
margin-top: 70px;
/* border: 2px solid blue; */
display: flex;
}
margin: 0;
}
</style>
</head>
<body>
<div class="first">
<div class="sec" style="text-align:center;">
<form name = "form1" ><br>
<label style="margin-right: 30px;" for="fname">SSN Id:</label>
<input type="number" id="fname" name="fname" value="" required><br>
<label for="lname">Customer Id:</label>
<input type="number" id="lname" name="lname" value="" ><br>
<label style="margin-right: 38px;" for="lname">Name:</label>
<input type="text" placeholder="Tarun" id="lname" name="lname" onkeydown="return
/[a-zA-Z]/i.test(event.key)" value="" required readonly><br>
<label style="margin-right: 52px;" for="lname">Age:</label>
<input type="number" placeholder="24" id="lname" name="lname" value="" required
onkeydown="return /[0-
9xxxxxxxxx]/i.test(event.key)" readonly><br>
<label style="margin-right: 28px;" for="lname">Address:</label>
<input type="text" placeholder="Jammu" id="lname" name="lname" value=""required
readonly><br><br>
<span>
onclick="stringlength(document.form1.fname,9,9)">DELETE</button>
</span>
<span>
<input type="submit" value="Cancel">
</span>
</form>
</div>
</div>
</body>
</html>
<script>

{

{
return false;
}
else
{
alert("Customer has been deleted successfully.");
return false;
}
}
</script>
Deposti Money
<!DOCTYPE html>
<html>
<head>
<style>
.table{
display:block;
margin:auto;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<ul>
<li>
<ul>
Money</a></li>
Money</a></li>
Money</a></li>
</ul>
</li>
<li>
<ul>
Statement</a></li>
</ul>
</li>
<li>
<ul>
Search</a></li>
Search</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<br>
<center><h1>Deposit Money</h1></center>
<br>
<form name="myForm" style = " margin : auto; display : block;">

<table align="center" style= "width:100%">
<tr>
<td colspan="2 " align="center">Customer Id: <input
type="text"placeholder="EnterCustomerId"name="CustomerID" id="CustomerId"
pattern="\d*" minlength="9" maxlength="9" required ></td></tr>
<tr>
<td colspan="2 " align="center">Account ID: <input
type="text"placeholder="EnterAccount"name="AccountID" id="AccountId" pattern="\d*"
minlength="9" maxlength="9" required></td></tr>
<tr>
<td colspan="2 " align="center">Account Selection: <select name="acc" id="acc">
</select></td></tr>
<tr>
<td colspan="2 " align="center">Deposit Amt: <input
type="number"placeholder="EnterAmount"name="amount" id="amount" required></td></tr>
<tr></tr><tr><td colspan="2 " align="center"> <input type="submit"
value="Submit"
onclick="validate(document.myForm.CustomerId,document.myForm.AccountId,document.myF
orm.amount,9,9)"></td></tr>
</table>
</form>
</body>
</html>
<script>
function validate(inputtxt,a,b,minlength, maxlength)
{
var c=a.value;
var d=b.value;

{
alert("Please input the SSN ID of 9 characters");
return false;
}
else if(c.length=mnlen && d.length>0)
{
alert('Amount deposited successfully');
return true;
}
}
</script>
Login
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />

</head>
<title>Login Form Demo</title>
<body>
<div class="login-wrapper">
<form name="myForm" class="form" method="post" action="abc.jsp">
<h2>Login</h2>
<div class="input-group">
Name: <input type="text" name="loginUser" id="loginUser" minlength="8"
required><br/>
Password: <input type="password" name="loginPassword" id="loginPassword"
minlength="10" required><br/>
</div>
</form>
<button onclick="myFunc()" class="submit-btn">Click me</button>
</div>
</body>
</html>
<script>
function myFunc() {
var name=document.myForm.loginUser.value;
var password=document.myForm.loginPassword.value;
if (name=="Aryan1234" && password=="Aryan123456"){
window.location.href = "Create_Customer.html";
}
else if(name=="Anurag1234" && password=="Anurag123456"){
window.location.href = "Deposit_Money.html";
}
else{
alert("Usernam or Password is wrong");
}
</script>
Transfer_moneyu
<!DOCTYPE html>
<html>
<head>
<style>
.table{
display:block;
margin:auto;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
}
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<ul>
<li>
<ul>
Money</a></li>
Money</a></li>
Money</a></li>
</ul>
</li>
<li>
<ul>
Statement</a></li>
</ul>
</li>
<li>
<ul>
Search</a></li>
Search</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<center><h1>Transfer Money</h1></center>
<br>

<table align="center" style= "width:100%;">
<tr>
<td colspan="2 " align="center">Customer Id: <input
type="text"placeholder="EnterCustomerID"name="CustomerID"
id="CustomerId"required></td></tr>
<tr>
<td colspan="2 " align="center">Source Account Type: <select name="acc"
id="acc">
</select></td></tr>
<tr><
<td colspan="2 " align="center">Dest Account Type: <select name="acc" id="acc">
</select></td></tr>
<tr>
<td colspan="2 " align="center">Transfer Amt: <input
type="number"placeholder="EnterAmount"name="amount" id="Amount" required></td></tr>
</br>
<tr><td colspan="2 " align="center"> <input type="submit"
value="Transfer"
onclick="stringlength(document.myForm.CustomerId,document.myForm.Amount,9,9)"></
td></tr>
</div>
</table>
</form>
</body>
</html>
<script>
function stringlength(inputtxt,a,minlength, maxlength)
{
var c=a.value;
{
alert("Please enter a valid SSN/Customer ID of 9 characters");
return false;
}
else if(c.length>0)
{
alert("Amount transferred successfully");
return true;
}
}//Amount deposited successfully. tr not llowed
</script>
Update
<!DOCTYPE html>
<html>
<head>
<style>
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
}
ervice
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<div class="nav">
<ul>
<li>
<ul>
</ul>
</li>
<li>
<ul>
</ul>
</li>
<li>
<ul>
Status</a></li>
</ul>
</li>
</ul>
</div>
<form name="myForm">
<center><div class="container">
</div><table align="center">
<br>
<tbody><tr><td>Customer SSN ID</td><td>80000001</td></tr>
<tr><td>Customer ID</td><td>100000268</td></tr>
<tr><td>Old Customer Name</td><td>Test</td></tr>
<tr><td>New Customer Name</td><td><input type="text"
placeholder="Enter character only" name="New Customer Name" id="test"
onkeydown="return /[a-zA-Z]/i.test(event.key)"required></td></tr>
<tr><td>Old Address</td><td>Delhi</td></tr>
<tr><td>New Address</td><td><input
type="text"placeholder="Enter address" name="New Address" id="nameof"
onkeydown="return /[a-zA-Z0-9]/i.test(event.key)" required ></td></tr>
<tr><td>Old Age</td><td>23</td></tr>
<tr><td>New Age</td><td><input type="number"placeholder="Enter
age in numbers" name="New Age" id="ageof" required=""
maxlength="3"minlength="0"></td></tr>
<tr><td style="color: red;">(*)Fields are Mandatory</td></tr>
<tr><td colspan="2 " align="center"><input type="submit"

value="Submit"
onclick="validate(document.myForm.test,document.myForm.nameof,document.myForm.ageof
)"></td></tr>
</tbody></table></center>
</form>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
</body>
</html>
<script>
function validate(a,b,c){
var d=a.value;
var e=b.value;
var f=c.value;
if(f.length>2 || f<1){
alert("Enter Correct Age");
return false;
}
else if(d.length>0 && e.length>0 && f.length>0){
alert("Customer update initiated successfully");
return true;
}
}
</script>
Withdraw mopenyu
<!DOCTYPE html>
<html>
<head>
<style>
.table{
display:block;
margin:auto;
}
.footer
{
width:100%;
position:fixed;
left:0;
bottom:0;
padding:15px 22%;
background:black;
color:white;
display:flex;
.Service
{
flex-grow:2;
}
.footer div h3
{
font-size:30px;
color:yellow;
}
.About
{
display:block;
}
*
{
margin:0px;
padding:0px;
}
h3
{
margin-top:0px;
margin-bottom:0px;
color:white;
width:100%;
height:70px;
font-size:30px;
}
body
{
margin:0px;
padding:0px;
}
.nav
{
margin-top:0px;
width:100%;
background:yellow;
height:50px;
}
ul
{
float:right;
list-style:none;
padding:0;
margin:0;
position:absolute;
}
ul li
{
float:left;
margin-top:10px;
height:35px;
line-height:35px;
}
ul li a
{
width:190px;
color:black;
display:block;
font-size:18px;
text-align:center;
padding:5px;
font-weight:bold;
}
a:hover
{
background:green;
}
ul li ul
{
}
ul li ul li
{
float:none;
}
ul li ul
{
display: none;
}
ul li:hover ul
{
display:block;
}
#a
{
width:28px;
}
.pubg{
display: flex;
}
.pubg1{
margin-left: 38px;
}
.pubg2{
margin-left: 42px;
}
.pubg3{
margin-left: 28px;
}
.pubg4{
margin-left: 23px;
}
margin: 0;
}
</style>
</head>
<body>
<div>
<h3 id="h3_id"><br>
<ul>
<li>
<ul>
Money</a></li>
Money</a></li>
Money</a></li>
</ul>
</li>
<li>
<ul>
Statement</a></li>
</ul>
</li>
<li>
<ul>
Search</a></li>
Search</a></li>
</ul>
</li>
</ul>
</div>
<div class="About">
<h3>About Us</h3>
</div>
<h3>Services</h3>
</div>
<h3>Contact Us</h3>
<p style="font-
</div>

</footer>
<br>
<center><h1>Withdraw Money</h1></center>
<br>
<div class="pubg">
<table style= "width:100%;">
<tr>
<td colspan="2 ">Customer Id: <span class="pubg1">
<input type="number"placeholder="EnterCustomerId"name="CustomerID"
id="customerId"required/></td></tr></span>
<tr>
<td colspan="2 ">Account ID: <span class="pubg2">
<input type="text"placeholder="EnterAccount"name="AccountID"
id="AccountId"required/></td></tr></span>
<tr>
<td colspan="2 ">Account Selection: <select name="acc" id="acc">
</select></td></tr>
<tr>
<td colspan="2 ">Rem Balance : <span class="pubg3"><input
type="text"placeholder="90000"name="AccountID" id="AccountIdd" required
readonly></td></tr></span>
<tr>
<td colspan="2 ">Withdraw Amt: <span class="pubg4"><input
type="number"placeholder="EnterAmount"name="amount" id="Amount"
required></td></tr></span>
</div>
<tr><td colspan="2 "> <input type="submit"value="Submit"

onclick="validate()"></td></tr>
</div>
</table>
</form>
</body>
</html>
<script>
function validate(){
stringlength(document.myForm.customerId,document.myForm.AccountIdd,document.myForm.
Amount,9,9);
stringlength(document.myForm.AccountId,document.myForm.AccountIdd,document.myForm.A
mount,9,9);
}
function stringlength(inputtxt,a,b, minlength, maxlength)
{
c=a.value;
d=b.value;

{
alert("Please enter a valid Account/Customer ID of 9 characters");
return false;
}
else if(d>90000){
alert("Insufficient Balance");
return false;
}
else if(d.length>0){
alert("Amount withdrawn successfully")
return true;
}
// Amount withdrawn successfully.
}
//Cashier --> Deposit,Withdraw,Transfer --> Account Statement, Search both
//Executive --> C,U,D cusotemr --> Create,Delete account, --> Account and
customer status.
</script>
Validate login
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="style.css" />
</head>
<title>Login Form Demo</title>
<body>
<div class="login-wrapper">
<form name="myForm" class="form" onsubmit="" action="">
<h2>Login</h2>
<input type="text" name="loginUser" id="loginUser" required />
<label for="loginUser">User Name</label>
</div>
<input
type="password"
name="loginPassword"
id="loginPassword"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at
least one number and one uppercase and lowercase letter, and at least 8 or more
characters" required="">
<label for="loginPassword">Password</label>
</div>
<button type="submit" value="Login" class="submit-
btn"onclick="validate(document.myForm.loginUser,document.myForm.loginPassword)"><a
href="Create_Customer.html">Submit</a></button>
</form>
</div>
</body>
</html>
<script>
function validate(inputtxt, inputtxt2){
var name=inputtxt.value;
var pwd=inputtxt2.value;
if(name=="Aryan" && pwd=="Aryan1234" )
{
alert("Login succesfull. Re-directing to Customer page");
}
else if(name=="Anurag" && pwd=="Anurag1234"){
alert("Login Successfull. Re-directing to executive page")
}
else{
{
alert('Username or password is wrong');
return false;
}
}
}
</script>
Style.css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background-size: cover;
font-family: sans-serif;
}
.login-wrapper {
height: 100vh;
width: 100vw;
display: flex;
}
.form {
position: relative;
width: 100%;
max-width: 380px;
padding: 80px 40px 40px;
background: rgba(0, 0, 0, 0.7);
border-radius: 10px;
color: #fff;
box-shadow: 0 15px 25px rgba(0, 0, 0, 0.5);
}
.form::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 100%;
background: rgba(255, 255, 255, 0.08);
transform: skewX(-26deg);
transform-origin: bottom left;
border-radius: 10px;
pointer-events: none;
}
.form img {
position: absolute;
top: -50px;
left: calc(50% - 50px);
width: 100px;
background: rgba(255, 255, 255, 0.8);
border-radius: 50%;
}
.form h2 {
text-align: center;
letter-spacing: 1px;
margin-bottom: 2rem;
color: white;
}
.form .input-group {
position: relative;
}
.form .input-group input {
width: 100%;
padding: 10px 0;
font-size: 1rem;
margin-bottom: 30px;
border: none;
border-bottom: 1px solid #fff;
outline: none;
background-color: transparent;
color: inherit;
}
.form .input-group label {
position: absolute;
top: 0;
left: 0;
padding: 10px 0;
font-size: 1rem;
pointer-events: none;
transition: 0.3s ease-out;
}
.form .input-group input:focus + label,
.form .input-group input:valid + label {
transform: translateY(-18px);
color: white;
font-size: 0.8rem;
}
.submit-btn {
display: block;
margin-left: auto;
border: none;
outline: none;
background: #ff652f;
font-size: 1rem;
text-transform: uppercase;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
}
.forgot-pw {
color: inherit;
}
#forgot-pw {
position: absolute;
display: flex;
top: 0;
left: 0;
right: 0;
height: 0;
z-index: 1;
background: #fff;
opacity: 0;
transition: 0.6s;
}
#forgot-pw:target {
height: 100%;
opacity: 1;
}
.close {
position: absolute;
right: 1.5rem;
top: 0.5rem;
font-size: 2rem;
font-weight: 900;
text-decoration: none;
color: inherit;
}
pAg1 1555
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<center><h1>Account Statement</h1></center>
<form>
<table align="center">
<div class ="container">
<tr><td>Account ID:*</td><td><input
type="text"placeholder=""name=Account ID"reqired maxlength="15"
minlength="8"></td></tr>
<tr><td>Start Date:*</td><td><input
type="text"placeholder=""name="Start Date"reqired maxlength="15"
<tr><td>End Date:*</td><td><input
type="text"placeholder=""name="End Date"reqired maxlength="3"
<tr><td>(*)Fields are Compulsory</td></tr>
<tr><td colspan="2" align="center" ><input type="submit"
value="Submit"></td></tr>
</div>
</table>
<div></div>
<table align="center" border="2" cellspacing="0" cellpadding="4">
<tr bgcolor="yellow">
<td><b>Transaction ID</b></td>
<td><b>Description</td>
<td><b>Date(YYYY-MM-DD)</b></td>
<td><b>Amount</b></td>
</tr>
<tr>
<td>000003164</td>
<td>Withdraw</td>
<td>2018-06-24</td>
<td>200</td>
</tr>
<tr>
<td>000003159</td>
<td>Withdraw</td>
<td>2018-06-24</td>
<td>900</td>
</tr>
<tr>
<td>000003157</td>
<td>Withdraw</td>
<td>2018-06-24</td>
<td>20</td>
</tr>
<tr>
<td>000003158</td>
<td>Deposit</td>
<td>2018-06-24</td>
<td>2000</td>
</tr>
<tr>
<td>000003224</td>
<td>Withdraw</td>
<td>2018-06-26</td>
<td>100</td>
</tr>
<tr>
<td>000003229</td>
<td>Withdraw</td>
<td>2018-06-24</td>
<td>2005</td>
</tr>
<tr>
<td>000003222</td>
<td>Deposit</td>
<td>2018-06-24</td>
<td>100</td>
</tr>
<tr>
<td>000003221</td>
<td>Tranfer</td>
<td>2018-06-24</td>
<td>100</td>
</tr>
<tr>
<td>000003220</td>
<td>Transfer</td>
<td>2018-06-24</td>
<td>200</td>
</tr>
<tr>
<td>000003217</td>
<td>Withdraw</td>
<td>2018-06-24</td>
<td>200</td>
</tr>
</table>
</table>
<center><tr><td colspan="2 " ><input type="submit" value="Download as PDF
File"></td>
<td colspan="2 " ><input type="submit" value="Download as Excel
File"></td></tr>
</table></center>
</body>
</html>

Final Project

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Final Project

Uploaded by

Copyright:

Available Formats

Account_Search

if(field.length<mnlen || field.length> mxlen)

if(field.length<mnlen || field.length> mxlen)

<table align="center" border="2" cellspacing="0" cellpadding="4">

<input type='text' id='cid' required /><br>

<select name="acc" name="acc">

<label for="lname">Deposit Amt:</label>

<label for="myText">Customer SSN Id:</label>

<label style="margin-right: 90px;" for="state">State:</label>

if(field.length<mnlen || field.length> mxlen)

if(field.length<mnlen || field.length> mxlen)

border:4x solid red;

<select name="acc" id="acc">

function stringlength(inputtxt, minlength, maxlength)

if(field.length<mnlen || field.length> mxlen)

<form name="myForm" style = " margin : auto; display : block;">

if(field.length<mnlen || field.length> mxlen)

<form name="myForm" style = " margin : auto; display : block;">

<tr><td colspan="2 " align="center"><input type="submit"

<tr><td colspan="2 "> <input type="submit"value="Submit"

if(field.length<mnlen || field.length> mxlen)

<form name="myForm" class="form" onsubmit="" action="">

You might also like