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 () {
var form = document.getElementById('contact-us-form');
form.addEventListener('submit', function (e) {
document.getElementById("contact-us-form-submit-button").classList.add('is-hidden');
document.getElementById("contact-us-form-loading-state").classList.remove('is-hidden');
});
var form = document.getElementById('contact-us-form');
if (!form) { return; }
form.addEventListener('tinyforms:submitted', function(e) {
form.classList.add('is-hidden');
document.getElementById("contact-us-form-success-message").classList.remove('is-hidden');
})
form.addEventListener('submit', function (e) {
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.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">
We are building tinyforms to make your work easier! Let us know what we can do for you.
</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">
<div class="columns is-centered">
<div class="column is-one-third">
@ -201,7 +201,7 @@
<div class="field">
<label class="label">Message</label>
<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 class="control has-text-centered">
@ -211,13 +211,16 @@
</div>
</div>
</form>
<div id="contact-us-form-success-message" class="columns is-centered is-hidden">
<div class="column is-one-third">
<h3 class="is-size-5">
Thank you for reaching out!
</h3>
</div>
<div id="contact-us-form-success-message" class="columns is-centered is-hidden">
<div class="column is-one-third">
<h3 class="title" style="margin-top:2em">
Thank you for reaching out!
</h3>
<p>
Btw. you just used a tinyform :)
</p>
</div>
</div>
</div>
</section>
</div>