Major Changes

We would like to share that we have some major changes on Getform.

Our file upload is now more stable and secure than ever. Our premium users are able to upload more than 1 file. 🗂

We changed friend invitation and form sharing experience completely. From now on, you can create teams and share which specific form you wish to share with your colleagues.

After we’ve finished our beta, we made changes on free and premium packages.

From now on, our custom form redirection feature will be available for premium users only. For our free users, redirect page will be Getform’s default redirection page. ➡ ➡

For our free users, form submission limit will be reduced to 10. After 10 submissions, users will be able to gather submissions, but they will have to be a premium user in order to preview their recent submissions.

Last but not least… The most requested and exciting part, our new feature, Zapier integration will be on Getform really soon! We are finishing development process and will inform all of our users as soon as we’re done.

How to submit your forms with AJAX

While using Getform, you can connect your forms to lots of services. In this article, we are going to examine how to use the form action code within javascript code with asynchronous javascript XML a.k.a AJAX calls.
We will use jQuery but if you are familiar with other javascript frameworks like Backbone, Angular or React, you can simply follow the same process.

Getting new form action code

In Getform getting a new form action code is easy, you just need to login to your Getform(https://getform.org) account and create a new form.

After filling the properties of your form, you wil be able to get your getform action code.

Ajax Part

//example action url
<form action="https://getform.org/f/70acae78-1c60-4d6f-839e-26bb0f38b503" accept-charset="UTF-8" method="POST">

With Getform action code we can send ajax request to Getform servers.

<form id="formd" action="https://getform.org/f/70acae78-1c60-4d6f-839e-26bb0f38b503" accept-charset="UTF-8" method="POST">
    <input type="text" name="message" placeholder="asd" />
    <input type="text" name="email" placeholder="asd" />
    <input id="send" type="submit" />
</form>
<div id="success" style="opacity:0;">Thank you!</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {

});

$('#formd').submit(function(event) {
    event.preventDefault();
    var formEl = $(this);
    var submitButton = $('input[type=submit]', formEl);
    $.ajax({
        method: 'POST',
        url: formEl.prop('action'),
        data: formEl.serialize(),
        crossDomain: false,
        beforeSend: function() {
            submitButton.prop('disabled', 'disabled');
        }
    }).done(function(data) {
        submitButton.prop('disabled', false)
        $('#success').css('opacity', '1')
    });
});
</script>

As you can see in the code above, you just need to spot on “crossDomain:true”.This will send a request with the required headers.

Submitting your forms using Getform with Ajax is easy. In this article we basicly showed how to use it easily.