Skip to content

B
BootcampWebDia6
Commit e93645af by Cesar Giulano Gonzalez Maqueda
Options

Js Ejercicio 3

parent 7df4616f
Showing with 53 additions and 0 deletions
src/JsDomEj3.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ejercicio 3</title>
<style>
.errormsg{
color: red;
display: none;
}
</style>
</head>
<body>
<form action="mailto:me@fakeemail.com" id="formx">
<fieldset>
<legend>Personal details</legend>
<p>
<label>
Full name:
<input type="text" name="fullname" id="fullname">
</label>
</p>
<p class="errormsg" id="nameerrormsg">Please enter your name above</p>
<p>
<label>
Street Address:
<input type="text" name="streetaddr" id="streetaddr">
</label>
</p>
<p class="errormsg" id="addrerrormsg">Please enter your street
address</p>
</fieldset>
<input type="submit" value="Submit it!">
</form>
</body>
<script>
document.querySelector('#formx').addEventListener('submit', ()=>{
const nameError = document.querySelector('#nameerrormsg');
const streetError = document.querySelector('#addrerrormsg');
if(document.querySelector('#fullname').value === ""){
nameError.style.display = 'block';
}else{
nameError.style.display = 'none';
}
if(document.querySelector('#streetaddr').value === ""){
streetError.style.display = 'block';
}else{
streetError.style.display = 'none';
}
});
</script>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment