How to update your current contact form integration to include uploaded files

As of March 2018 - you can upload Assets using our API. The most common use case for this is when submitting a quote request, you want the potential customer to upload any files.

Before you begin

If you have NOT already set up our contact form to sales lead integration, please read this article for instructions.If you are using an earlier version of the contact form to sales integration, use this current article to update your existing form.

Step-by-step instructions on how to update your contact form for Asset upload

1. Add this HTML code to your form code

This should be added where you want the upload asset option to appear.

<div class="form-group">
  <label for="asset">Asset</label>
  <input type="file" name="asset" id="asset"></input>
</div>

The code will create a file upload field in your form - just like in the screenshot below.

2. Find and remove this Javascript code

$.ajax({
  url: actionUrl,
  type: 'post',
  dataType: 'json',
  data: $("#contactForm").serialize(),
  success: function(data) {
    console.log(data);
    if (successUrl) {
      window.location = successUrl;
    }
  },
  error: function(xhr, status, error) {
    alert(error);
    console.log(xhr, status, error);
  }
});

3. Replace the removed code with this Javascript code

$.ajax({
  url: actionUrl,
  type: "post",
  dataType: "json",
  processData: false,
  contentType: false,
  data: new FormData($("#contactForm")[0]),
  success: function(data) {
    console.log(data);
    if (successUrl) {
      window.location = successUrl;
    }
  },
  error: function(xhr, status, error) {
    alert(error);
    console.log(xhr, status, error);
  }
});

What's Next?

How helpful was this doc?

Master Guide to Automation & Integration

What are some popular advantages when using Zapier?

Contact