First Name Last Name * Email * Submit (function () { getForm().addEventListener('submit', (e) => { e.preventDefault(); ajaxSubmit(); }); function ajaxSubmit() { const form = getForm(); const data = {}; const inputs = form.getElementsByTagName('input'); for (var input of inputs) { var name = input.getAttribute('name'); data[name] = input.value; } const selects = form.getElementsByTagName('select'); for (var select of selects) { var name = select.getAttribute('name'); data[name] = select.value; } const textareas = form.getElementsByTagName('textarea'); for (var textarea of textareas) { var name = textarea.getAttribute('name'); data[name] = textarea.value; } const httpRequest = new XMLHttpRequest(); httpRequest.open('POST', form.getAttribute('action'), true); httpRequest.setRequestHeader('Content-Type', 'application/json'); httpRequest.send(JSON.stringify(data)); httpRequest.onreadystatechange = () => { if (httpRequest.readyState !== XMLHttpRequest.DONE) return; var status = httpRequest.status; var response = httpRequest.response; var responseData = response && response.startsWith('{') ? JSON.parse(response) : {}; if (status === 200) { if (responseData.redirect) location.replace(responseData.redirect); hide(form.querySelector('.form-table')); hide(form.querySelector('button[type="submit"]')); showMessage('success', responseData.message || 'Data sucessfully sent!'); } else if (status === 400) { var message = responseData.message || responseData.Message || 'Failed to send data.'; showMessage('error', message, 10000); } else showMessage('error', 'Failed to send data.', 10000); }; } function showMessage(msgClass, message, time) { const replacements = { '&': '&', '<': '<', '>': '>', "'": ''', '"': '"' }; message = message.replace(/[&<>'"]/g, tag => (replacements[tag] || tag)); const messageP = getForm().querySelector('.form-message'); messageP[removed] = message; messageP.setAttribute('style', ''); messageP.setAttribute('class', 'form-message ' + msgClass); if (time) setTimeout(() => hide(messageP), time); } function getForm() { return document.querySelector('.usherpa-form'); } function hide(element) { if (!element || typeof element.setAttribute !== 'function') return; element.setAttribute('style', 'display: none'); } })();