less global id in dom

This commit is contained in:
Adrian Amaglio 2020-08-25 10:07:30 +02:00
parent 9e9d393de8
commit 7f75ca2712

View File

@ -1,5 +1,4 @@
function message (level, text) { function message (messageContainer, level, text) {
const messageContainer = document.getElementById('contact-mailer-message')
const messageElement = document.createElement('p') const messageElement = document.createElement('p')
messageContainer.appendChild(messageElement) messageContainer.appendChild(messageElement)
messageElement.textContent = text messageElement.textContent = text
@ -15,11 +14,17 @@ function interceptForm (formId) {
* This function intercepts a form submission and send it via XHR. * This function intercepts a form submission and send it via XHR.
* Param formId is the HTML id of the form * Param formId is the HTML id of the form
*/ */
const formElem = document.getElementById(formId) const formElem = document.getElementById(formId)
if (!formElem) { if (!formElem) {
console.error('You tried to intercept form id:"' + formId + '" but it was not found.') console.error('You tried to intercept form id:"' + formId + '" but it was not found.')
return return
} }
/* Create the message container */
const messageBox = document.createElement('div')
messageBox.classList.add('contact-mailer-message-container')
formElem.parentNode.insertBefore(messageBox, formElem)
/* Intercept the submit event */
formElem.onsubmit = async (e) => { formElem.onsubmit = async (e) => {
e.preventDefault() e.preventDefault()
fetch(formElem.action, { fetch(formElem.action, {
@ -28,14 +33,14 @@ function interceptForm (formId) {
}) })
.then(data => { .then(data => {
if (!data.ok || data.status == 500) { if (!data.ok || data.status == 500) {
message('error', 'Erreur du service denvoi. Réessayez plus tard ou contactez https://jean-cloud.net') message(messageBox, 'error', 'Erreur du service denvoi. Réessayez plus tard ou contactez https://jean-cloud.net')
} else if (data.ok || data.status == 200) { } else if (data.ok || data.status == 200) {
message('success', 'Le message a bien été envoyé !') message(messageBox, 'success', 'Le message a bien été envoyé !')
formElem.reset() formElem.reset()
} }
}) })
.catch((error) => { .catch((error) => {
message('error', 'Impossible denvoyer le formulaire. Vérifiez votre connexion internet ou réessayez plus tard.') message(messageBox, 'error', 'Impossible denvoyer le formulaire. Vérifiez votre connexion internet ou réessayez plus tard.')
}) })
} }
} }