For some reasons, I can't display #coupon with javascript, when i try to get elementById it displays the error message elementById undefined,
HTML
<html>
<head>
<title>Exercise</title>
<link rel="stylesheet" href="stylesheet.css">
<script src="javascript.js"></script>
</head>
<body>
<div class="inputi">
<p class="input-text">Une Jam?</p> <input placeholder="Sheno emrin..." type="text" id="inputId">
//checks input value
<button type="button" onclick="getInputValue()">Vazhdo</button>
// shows error message if it doesn't match the array
<p id="message"></p>
</div>
// i want to display this with javascript, after the login
<h1 id="coupon">You won giftcard </strong></h1>
<button id="coupon">abas</button>
</body>
</html>
JS ( the problem )
** the problem getElementById is undefined, I want to display:block after the successful login attempt. **
var zzz = getElementById("coupon")
if(zzz === "none") {
display:block; }
// document.writeln("<h1>Keni fituar kupon 50% ne <strong> Green & Protein </strong> </h1>");
// document.writeln('<input class="giftcode" placeholder="' +finalcode+'" type="text" id="inputId">');
display_image(images[z], 400, 400, 'Javascript');
document.write('<br>' + user[i]);
}
}
}
Two things:
getElementById should be document.getElementById
you need to move your script tag to the bottom of the body tag to ensure that the element is in the DOM when you select it
Use:
<html>
<head>
<title>Exercise</title>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<div class="inputi">
<p class="input-text">Une Jam?</p>
<input placeholder="Sheno emrin..." type="text" id="inputId">
//checks input value
<button type="button" onclick="getInputValue()">Vazhdo</button>
// shows error message if it doesn't match the array
<p id="message"></p>
</div>
// i want to display this with javascript, after the login
<h1 id="coupon">You won giftcard </h1>
<button id="coupon">abas</button>
<script src="javascript.js"></script>
</body>
</html>
Call document.getElementById instead. Docs - https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
From your code above it shows that you're trying to call a method getElementById() which you have not yet defined.
2ndly, you can only assign only 1 id in a document else it will not work.
you can do something like this
// i want to display this with javascript, after the login
<span id="coupon" style="display: none">
<h1>You won giftcard </strong></h1>
<button>abas</button>
</span>
what you meant to call is document.getElementById("coupon"); which is the right function to do.
so try this;
var zzz = document.getElementById("coupon");
i don't really know what your criteria is for a successful login but this show help
let say you set a variable as var success = "yes" on successful login
if(success === "yes"){
zzz.style.display = "block";
}