USING NETLIFY FORMS

elizabethonyen6

Elizabeth Onyenekwe

Posted on August 10, 2020

USING NETLIFY FORMS

While hosting your frontend applications on netlify, you can permit your forms to be submitted on Netlify without using any backend or api for submission and with just a little code, netlify takes care of it all.

Form submission on netlify can be achieved by setting the form action to “POST” and adding a Netlify attribute called “DATA-NETLIFY” and setting this attribute to “TRUE”. Give a name attribute to your form and input fields so that Netlify can identify the fields properly. Deploy your form to Netlify and all messages sent through the form is displayed in the “RECENT FORM SUBMISSIONS” section.

Setting Notifications

You can also be notified of a recent form submission on your email by going to the settings section on Netlify, then clicking on the forms section and then form notifications. Click on the “ADD NOTIFICATION” button and save Email notification to receive emails notifying you of recent form submissions.

Code Sample

<form action="POST" name="contact" data-netlify="true">
  <div>
    <div>
      <input type="text" name="name" placeholder="Your Name" />
    </div>
    <div>
      <input type="email" name="email" placeholder="Your Email" />
    </div>
  </div>
  <div>
    <input type="text" name="subject"  placeholder="Subject" />
  </div>
  <div>
    <textarea name="message" rows="5" placeholder="Message"></textarea>
  </div>
  <div>
    <button type="submit">Send Message</button></div>
</form>
Enter fullscreen mode Exit fullscreen mode
💖 💪 🙅 🚩
elizabethonyen6
Elizabeth Onyenekwe

Posted on August 10, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related