This commit is contained in:
bumi 2020-04-30 15:31:36 +02:00
parent 67b538c8b5
commit aec07b9438
2 changed files with 22 additions and 17 deletions

View File

@ -1,5 +1,7 @@
document.addEventListener("turbolinks:load", function () { document.addEventListener("turbolinks:load", function () {
var form = document.getElementById('contact-us-form'); var form = document.getElementById('contact-us-form');
if (!form) { return; }
form.addEventListener('submit', function (e) { form.addEventListener('submit', function (e) {
document.getElementById("contact-us-form-submit-button").classList.add('is-hidden'); document.getElementById("contact-us-form-submit-button").classList.add('is-hidden');
document.getElementById("contact-us-form-loading-state").classList.remove('is-hidden'); document.getElementById("contact-us-form-loading-state").classList.remove('is-hidden');
@ -8,5 +10,5 @@ document.addEventListener("turbolinks:load", function () {
form.addEventListener('tinyforms:submitted', function(e) { form.addEventListener('tinyforms:submitted', function(e) {
form.classList.add('is-hidden'); form.classList.add('is-hidden');
document.getElementById("contact-us-form-success-message").classList.remove('is-hidden'); document.getElementById("contact-us-form-success-message").classList.remove('is-hidden');
}) });
}); });

View File

@ -188,7 +188,7 @@
<p class="paragraph"> <p class="paragraph">
We are building tinyforms to make your work easier! Let us know what we can do for you. We are building tinyforms to make your work easier! Let us know what we can do for you.
</p> </p>
<form id="contact-us-form" data-tinyforms="true" method=" POST" <form id="contact-us-form" class="contact-form has-text-left" data-tinyforms="true" method="POST"
action="https://tinyforms.herokuapp.com/s/mT4qT3SjGczmKpFhKXdw4YRW" enctype="multipart/form-data"> action="https://tinyforms.herokuapp.com/s/mT4qT3SjGczmKpFhKXdw4YRW" enctype="multipart/form-data">
<div class="columns is-centered"> <div class="columns is-centered">
<div class="column is-one-third"> <div class="column is-one-third">
@ -201,7 +201,7 @@
<div class="field"> <div class="field">
<label class="label">Message</label> <label class="label">Message</label>
<div class="control"> <div class="control">
<textarea class="textarea" name="message" placeholder="How can we help you?"></textarea> <textarea class="textarea" name="message" required="true" placeholder="How can we help you?"></textarea>
</div> </div>
</div> </div>
<div class="control has-text-centered"> <div class="control has-text-centered">
@ -213,9 +213,12 @@
</form> </form>
<div id="contact-us-form-success-message" class="columns is-centered is-hidden"> <div id="contact-us-form-success-message" class="columns is-centered is-hidden">
<div class="column is-one-third"> <div class="column is-one-third">
<h3 class="is-size-5"> <h3 class="title" style="margin-top:2em">
Thank you for reaching out! Thank you for reaching out!
</h3> </h3>
<p>
Btw. you just used a tinyform :)
</p>
</div> </div>
</div> </div>
</div> </div>