bumi/tinyforms
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Cleanup

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/javascript/contact_us_form.js
View File

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

19
app/views/home/index.html.erb
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">
@ -211,13 +211,16 @@
</div> </div>
</div> </div>
</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>
</div> <p>
Btw. you just used a tinyform :)
</p>
</div> </div>
</div>
</div> </div>
</section> </section>
</div> </div>