Netlify Form support

This commit is contained in:
zzossig 2020-12-10 06:42:20 +09:00
parent c52fed88df
commit 7c1c61b6bf
2 changed files with 41 additions and 0 deletions

View File

@ -13,6 +13,8 @@
{{ partial "contact/formspree" . }} {{ partial "contact/formspree" . }}
{{ else if eq .Params.service "getform" }} {{ else if eq .Params.service "getform" }}
{{ partial "contact/getform" . }} {{ partial "contact/getform" . }}
{{ else if eq .Params.service "netlifyform" }}
{{ partial "contact/netlifyform" . }}
{{ end }} {{ end }}
</div> </div>
</main> </main>

View File

@ -0,0 +1,39 @@
<form action={{ $.Param "redirect-after-submit" }} name="contact" method="POST" data-netlify="true" class="contact__form">
<div class="contact__input--container">
<div class="contact__input--wrapper">
<label class="contact__label">
{{ i18n "contact-name" }}
</label>
<input type="text" name="name" class="contact__input" aria-label="{{ i18n "contact-name" }}">
</div>
<div class="contact__input--wrapper">
<label class="contact__label">
{{ i18n "contact-email" }}
</label>
<input type="email" name="email" class="contact__input" aria-label="{{ i18n "contact-email" }}">
</div>
</div>
<div class="contact__message--wrapper">
<label class="contact__label">
{{ i18n "contact-message" }}
</label>
<textarea name="message" class="contact__message" aria-label="{{ i18n "contact-message" }}"></textarea>
</div>
<input type="submit" value="{{ i18n "contact-send" }}" class="contact__send">
</form>
<script>
var formElem = document.querySelector("form");
formElem.addEventListener("submit", handleSubmit);
var handleSubmit = function(e) {
e.preventDefault();
var formData = new FormData(formElem)
fetch('/', {
method: 'POST',
headers: { "Content-Type": "application/x-www-form-urlencoded" },
body: new URLSearchParams(formData).toString()
}).then(() => console.log('Form successfully submitted')).catch((error) =>
alert(error))
}
</script>