AJAX Submission

Easily extend your Slapforms to use AJAX instead of the default HTML form.

What is an AJAX submission

AJAX is a technique to access web servers using Javascript. You can use it to submit Slapform via Javascript instead of the default HTML form, and it's super easy to set up.

AJAX is a part of jQuery, but if you don't want to use jQuery you can also use our Slapform NPM module that does the same thing and it's a much smaller library (it works in browser and node environments seamlessly).

AJAX Example

Below is a "kitchen-sink" example utilizing all of the available Name Triggers. Copy and paste and customize to your needs!

    
      <script
      src="https://code.jquery.com/jquery-3.2.1.min.js"
      integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
      crossorigin="anonymous"></script>

      <script type="text/javascript">
        $( document ).ready(function() {
          $.ajax({
            url: 'https://api.slapform.com/[email protected]',
            dataType: 'json',
            type: 'POST',
            data: {
              name: 'Jon Snow',
              message: 'Hello World! This is my first Slapform submission.',
              slap_subject: 'My Favorite Message',
              slap_replyto: '[email protected]'
              slap_debug: true,
              slap_webhook: 'https://yourwebsite.com/webhook',
              slap_honey: ''
              /* These Slapform Name Triggers exist but aren't applicable to AJAX submissions */
              // slap_redirect: 'https://yourwebsite.com',
              // slap_captcha: false,

            },
            success: function (response) {
              console.log('Got data: ', response);
              if (response.meta.status == 'success') {
                console.log('Submission was successful!');
                // window.location.href = 'https://google.com' // Uncomment this line if you want to redirect the user upon a successful submission
              } else if (response.meta.status == 'fail') {
                console.log('Submission failed with these errors: ', response.meta.errors);
              }
            }
          });
        });
      </script>