Replace dummy homepage form with webhook donor form\n\nAdds stripped webhook form and inline JS pointing at webhook URL https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c76e6b4e-af2f-4bc3-9875-6460d0ffc8e3
This commit is contained in:
+85
-21
@@ -182,28 +182,92 @@
|
|||||||
<li class="flex gap-3"><span class="text-brand-emerald" aria-hidden="true">•</span><span data-i18n="trial-bullet3"></span></li>
|
<li class="flex gap-3"><span class="text-brand-emerald" aria-hidden="true">•</span><span data-i18n="trial-bullet3"></span></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<form class="bg-white text-brand-ink rounded-3xl p-8 shadow-brand space-y-5" data-event="form:trial">
|
<form id="donorForm" novalidate>
|
||||||
<label class="block text-sm font-medium">
|
<select name="location" id="locationSelect" style="display:none">
|
||||||
<span data-i18n="trial-label-email"></span>
|
<option value="">Select Location</option>
|
||||||
<input type="email" required class="mt-2 w-full rounded-2xl border border-brand-smoke px-4 py-3 focus:outline-none focus:ring-2 focus:ring-brand-accent" data-i18n-placeholder="trial-placeholder-email" />
|
<option value="Boston">US, Boston</option>
|
||||||
</label>
|
<option value="Manchester">UK, Manchester</option>
|
||||||
<label class="block text-sm font-medium">
|
<option value="Mumbai">IN, Mumbai</option>
|
||||||
<span data-i18n="trial-label-priority"></span>
|
<option value="Saopaulo">BR, Sao Paulo</option>
|
||||||
<select class="mt-2 w-full rounded-2xl border border-brand-smoke px-4 py-3 focus:outline-none focus:ring-2 focus:ring-brand-accent">
|
<option value="meppel">NL, Meppel</option>
|
||||||
<option data-i18n-option="priority-1"></option>
|
<option value="sydney">AU, Sydney</option>
|
||||||
<option data-i18n-option="priority-2"></option>
|
|
||||||
<option data-i18n-option="priority-3"></option>
|
|
||||||
<option data-i18n-option="priority-4"></option>
|
|
||||||
</select>
|
</select>
|
||||||
</label>
|
|
||||||
<label class="block text-sm font-medium">
|
<input type="text" name="name" placeholder="Name" required>
|
||||||
<span data-i18n="trial-label-region"></span>
|
<input type="text" name="company" placeholder="Company" required>
|
||||||
<input type="text" class="mt-2 w-full rounded-2xl border border-brand-smoke px-4 py-3 focus:outline-none focus:ring-2 focus:ring-brand-accent" data-i18n-placeholder="trial-placeholder-region" />
|
<input type="text" name="country" placeholder="Country" required>
|
||||||
</label>
|
<input type="text" name="street" placeholder="Street" required>
|
||||||
<p class="text-xs text-brand-ink/70" data-i18n="trial-microcopy"></p>
|
|
||||||
<button type="submit" class="w-full py-3 rounded-2xl bg-brand-accent text-brand-ink font-semibold" data-i18n="cta-trial"></button>
|
<div>
|
||||||
<p class="text-xs text-brand-ink/60 text-center" data-i18n="trial-help"></p>
|
<input type="text" name="zip" placeholder="ZIP" required>
|
||||||
</form>
|
<input type="text" name="town" placeholder="Town" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="email" name="email" placeholder="Email" required>
|
||||||
|
|
||||||
|
<input type="hidden" name="product" id="productField" value="">
|
||||||
|
<input type="hidden" name="price" id="priceField" value="">
|
||||||
|
|
||||||
|
<button type="submit">Send</button>
|
||||||
|
|
||||||
|
<div id="formMessage" aria-live="polite"></div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const WEBHOOK_URL = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c76e6b4e-af2f-4bc3-9875-6460d0ffc8e3";
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const form = document.getElementById('donorForm');
|
||||||
|
const msg = document.getElementById('formMessage');
|
||||||
|
const locationSelect = document.getElementById('locationSelect');
|
||||||
|
|
||||||
|
function maybeShowLocation(productName) {
|
||||||
|
if (!productName) { locationSelect.style.display = 'none'; locationSelect.required = false; return; }
|
||||||
|
if (productName.startsWith('_')) {
|
||||||
|
locationSelect.style.display = 'block';
|
||||||
|
locationSelect.required = true;
|
||||||
|
} else {
|
||||||
|
locationSelect.style.display = 'none';
|
||||||
|
locationSelect.required = false;
|
||||||
|
locationSelect.value = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// If you set product/price from buttons/links on the page, ensure those handlers call:
|
||||||
|
// document.getElementById('productField').value = 'exampleProduct';
|
||||||
|
// document.getElementById('priceField').value = '123';
|
||||||
|
// maybeShowLocation('exampleProduct');
|
||||||
|
|
||||||
|
form.addEventListener('submit', async (e) => {
|
||||||
|
e.preventDefault();
|
||||||
|
msg.textContent = '';
|
||||||
|
|
||||||
|
const data = {};
|
||||||
|
new FormData(form).forEach((value, key) => data[key] = value);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const res = await fetch(WEBHOOK_URL, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify(data)
|
||||||
|
});
|
||||||
|
|
||||||
|
if (res.ok) {
|
||||||
|
msg.textContent = 'Thank you — your submission was sent.';
|
||||||
|
form.reset();
|
||||||
|
maybeShowLocation('');
|
||||||
|
} else {
|
||||||
|
msg.textContent = 'Submission failed. Please try again.';
|
||||||
|
console.error('Webhook response status:', res.status, await res.text());
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
msg.textContent = 'Error submitting form. Please try later.';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user