Html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="">
</head>
<body>
<h1> Welcome to Benjamin's bank. Have some Money</h1>
<p>Please enter your name, password and the amount you want to withdraw</p>
<form action="" method="post">
<input type="text" value="name" id="name"><br>
<input type="password" value="password" id="password"><br>
<input type="text" value="amount" id="amount"><br>
<button onclick="withdraw()">click me</button>
</form>
<p id="para"></p>
<script src="Beginners_bank.js" async defer></script>
</body>
</html>
Javascript
function withdraw(){
var namevar= document.getElementById("name").value;
var passwordvar=document.getElementById("password").value;
var amountvar=document.getElementById("amount").value;
var Amount=3000;
var name="Benjamin Anoruo";
var pass="testing123";
var n=Amount-amountvar;
if(namevar==name && passwordvar==pass ){
if(amountvar<=Amount){
document.getElementById("para").innerHTML="your withdrawal was successful. your new balance is:"+n;
document.body.style.backgroundColor='green';
}
}
}
This code is supposed to take users name password and amount they want to withdraw.anytime I enter every detail and click the button it just flashes the output and return an empty form Please how can I fix this issue.