Design comparison
Solution retrospective
Please could someone advise best practice for submitting the form and obtaining the value. I was able to get the email value and add this to the text, however I couldnt add the error message. putting required on input and onsubmit, my js didn;t work.
Any other advise/tips please let me know.
Community feedback
- @fazzaamiarsoPosted over 1 year ago
Hi Lee! Great Work!
You can do something like this:
const emailInputEl = document.getElementById('emailValuetype'); test.addEventListener('click', (e) => { e.preventDefault(); const email = emailInputEl.value; if(email === "") { // example of showing error const someErrorEl = document.querySelector(""); someErrorEl.style.display = "inline" return; // This early return prevents button from being submitted } successText.innerHTML = `A confirmation email has been sent to <strong>${input}</strong> Please open it and click the button inside to confirm your subscription.`; wrapper.style.display = 'none'; success_page.style.display = 'flex'; });
I hope it answers your question! Cheers!
Marked as helpful1 - @leecockcroftPosted over 1 year ago
Thank you for your help
Follow me on Twitter as I am about to start the 100 Days of code https://twitter.com/leecockcroft20
0 - @enesekenPosted over 1 year ago
U should add "padding: 15px;" to your "image" it will be greater than this 👍
0 - @Iqboljon-Developer07Posted over 1 year ago
i order to show error you should just add another class to your input this class will have border color of red and text as well
0@leecockcroftPosted over 1 year ago@Iqboljon-Developer07 Thank you for your response, however this will still allow the button to be submitted,
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord