Ok with the help of stackers I was able to get an error message to show up below input form.
What I need is the error message to not be displayed when the user enters in any input in the form. What am I doing wrong?
Heres the HTML
<form id="url">
<input type="text" name="urlName">
<input type="submit" value="Build Your App"></input>
</form>
<div id="error-message">
</div>
Heres the JS
document.getElementById("url").addEventListener("submit", (event) => {
event.preventDefault()
let errorMessage = document.getElementById("error-message").innerHTML = "Please provide your store URL";
let myForm = document.getElementById("url");
let formData = new FormData(myForm);
if (formData.get("urlName") === "")
return errorMessage;
EndOfUrl = sanitizeDomainInput(formData.get("urlName"));
newUrl = redirectLink(EndOfUrl);
window.location.href = newUrl;
return false;
});
function sanitizeDomainInput(input) {
input = input || 'unknown.com'
if (input.startsWith('http://')) {
input = input.substr(7)
}
if (input.startsWith('https://')) {
input = input.substr(8)
}
var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\.[a-zA-Z]{2,3})$/)
return regexp.test(input) ? input : 'unknown.com';
}
function redirectLink(domain) {
return `https://dashboard.getorda.com/signup/?state=${domain}`;
}
document.getElementById("url").addEventListener("submit", (event) => { event.preventDefault() let errorMessage = "Please provide your store URL"; let myForm = document.getElementById("url"); let formData = new FormData(myForm); if (formData.get("urlName") === "") { document.getElementById("error-message").innerHTML = errorMessage; } EndOfUrl = sanitizeDomainInput(formData.get("urlName")); newUrl = redirectLink(EndOfUrl); window.location.href = newUrl; return false; }); function sanitizeDomainInput(input) { input = input || 'unknown.com' if (input.startsWith('http://')) { input = input.substr(7) } if (input.startsWith('https://')) { input = input.substr(8) } var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\\.[a-zA-Z]{2,3})$/) return regexp.test(input) ? input : 'unknown.com'; } function redirectLink(domain) { return `https://dashboard.getorda.com/signup/?state=${domain}`; }
<form id="url"> <input type="text" name="urlName"> <input type="submit" value="Build Your App"></input> </form> <div id="error-message"> </div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.