JAVASCRIPT- ATM help! I am working on this application, but i want this ATM to l
ID: 3582471 • Letter: J
Question
JAVASCRIPT- ATM help! I am working on this application, but i want this ATM to look more proficient? can anybody help? literally include anything you can thing of? like background maybe extra key bottoms like OTHER TRANSCATION,Add a SAVING and CHECKING account , so can deposit, withdraw from each other. CHANGE FROM SAVING TO CHECKING account. Also i want to make spaces between what its being displayed FOR EXAMPLE: it displays:
Message:
(I WANT A SPACE HERE)
Your Current Balance $: 526
(ANOTHER SPACE)
----> BELOW: I want to include more boxes to look for proficient like a "REAL ATM" like change between SAVING or CHECKING account ...ANY HELP IS APPRECIATED IT THANKS
-------------------------------------MY CODE---------------------------------------------------------------
<html>
<head>
<script>
function verify()
var i = 0;
var pin = '';
while(pin != "1234" && i!=3){
pin = prompt("Enter your ATM PIN");
if(pin == "1234")
{
alert("Authenticated!");
document.getElementById("bal").innerHTML = "526";
break;
}
else
{
alert("Invalid pin. Please try again!");
i++;
}
}
if (i==3)
alert("Retry Attemptes Over. Your Account is locked");
}
function deposit()
{
var amount = prompt("How much would you like to deposit?");
if(amount <= 0)
alert("Invalid amount. Please try again!");
else
{
alert("Transaction successful. ");
document.getElementById("msg").innerHTML = "$" + amount + " successfully deposited to your account."
document.getElementById("bal").innerHTML = parseInt(document.getElementById("bal").innerHTML) + parseInt(amount);
}
}
function withdraw()
{
var amount = prompt("How much would you like to withdrawal?");
if(amount <= 0)
alert("Invalid amount. Please try again!");
else if(amount >= parseInt(document.getElementById("bal").innerHTML))
alert("sorry insufficient balance");
else
{
alert("Transaction successful. Please take your money now.");
document.getElementById("msg").innerHTML = "$" + amount + " successfully withdrawn from your account.";
document.getElementById("bal").innerHTML = parseInt(document.getElementById("bal").innerHTML) - parseInt(amount);
}
}
function exit()
{
var amount = prompt("Click OK to Exit. Thanks for using ATM");
if (amount==false) {
alert("Have a nice day!");
}
}
</script>
<body>
Message: <span id='msg'></span><br>
Your Current Balance $: <span id='bal'></span><br>
<input type="button" value="Deposit" />
<input type="button" value="Withdraw" />
<input type="button" value="EXIT" />
</body>
</html>
Explanation / Answer
While designing the atm you just cannot rely only on html and javascript as it makes things somewhat clumsy and you have hardcode this most of the time. Use of a database will be a good choice with some combination of jsp or nodejs.
But since you only want to use javascript and html I have code 2 files in 1st file you will be asked yo enter userid and password. if it is correct to will be redirected to 2nd page, which contains most of the functionality of deposit and withdrawal.
file1
==================
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<p><input type="text" id='user' value="" placeholder="Username or Email"></p>
<p><input type="password" id="pass" value="" placeholder="Password"></p>
<p class="remember_me">
<label>
<input type="checkbox" name="remember_me" id="remember_me">
Remember me on this computer
</label>
</p>
<input type="submit" name="submit" value="Login">
</body>
<script>
function verify()
{
alert("hello");
var user=document.getElementById("user").value;
alert(user);
var pass=document.getElementById("pass").value;
alert(pass);
if(user=="admin" && pass=="pass")
{
window.location.href = '2.html?username='+user;
}
else
{
alert("Wrong userid/pass please re enter")
document.getElementById("user").value=null;
document.getElementById("pass").value=null;
}
}
</script>
</html>
============================
file2
============================
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
Welcome
Your Current Balance $: <span id='bal'>1000</span><br>
<button>Deposit</button>
<button>Withdraw</button>
<button >Exit</button>
<script>
function deposit() {
var amount = prompt("Please enter Depost amount);
if (amount != null) {
var val=document.getElementById("bal").value+amount;
document.getElementById("bal").innerHTML =val;
}
}
</script>
<script >
function withdraw() {
var amount = prompt("Please enter withdrawal amount);
if (amount != null) {
var val=document.getElementById("bal").value-amount;
document.getElementById("bal").innerHTML =val;
}
}
</script>
</body>
</html>
=========================================
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.