dlearman1
asked on
How to override browser's help text, hints?
I'm not js literate, obviously. I'm trying to override the browser default help text (or hints) using the following code but alert(name.value) is returning undefined, and I don't know why.
html
js
Also, how would I package this script as an external function call.
Thanks in advance
html
<div class="form__field">
<label for="full-name" class="sr-only">Full Name</label>
<input type="text" class="form-help" id="fullName" name="full-name" aria-describedby="nameHelp" placeholder="Full Name" required">
<div class="help-icon"<span></span></div>
<div id="nameHelp" class="help-text">Enter your full name. Example: Mary Doe</div>
<div class="invalid-feedback">Please enter your full name.</div>
</div>
js
<script>
var name = document.getElementById("fullName");
alert(name.value);
name.addEventListener("input", function (event) {
if (name.validity.typeMismatch) {
name.setCustomValidity("Name must be a minimum of 3 and maximum of 30 characters long");
} else {
name.setCustomValidity("something else");
}
});
</script>
Also, how would I package this script as an external function call.
Thanks in advance
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER