logo

Axios

Axiosย is an promise based HTTP client for the browser and node.js, it's lightweight and a common library for making HTTP requests. We are going to use the client side of Axios for this tutorial and show you how to make request to the your Formcarry form using Axios
You can use Axios to collect form submissions with formcarry

Installing Axios

To install it we have 3 options:
Using NPM or Yarn
shell
# Yarn $ yarn add axios # npm $ npm install axios --save

Using Bower
shell
bower install axios

Using CDN
javascript
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

Using JSON Content Type

Let's make a simple request
javascript
<script> axios.post('https://formcarry.com/s/YourFormID', {name: 'Alex', surname: 'Moran', email: 'alexmoran@bms.edu'}, {headers: {'Accept': 'application/json'} }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); </script>
Output:
javascript
data: {code: 200, status: "success", title: "Thank You!", message: "We received your submission"}
To try it, just change the url to your forms url.
๐Ÿ’ก
Donโ€™t set your Content-Type to application/json in axios headers, axios automatically does that and sometimes especially when you are uploading a file it causes problems.

x-www-form-url-encoded Request Using Axios

When data is an object axios uses application/json by default.
javascript
let formData = {name: 'Alex', surname: 'Moran'}; const encodeForm = (data) => { return Object.keys(data) .map(key => encodeURIComponent(key) + '=' + encodeURIComponent(data[key])) .join('&'); } axios.post('https://formcarry.com/s/YourFormID', encodeForm(formData), {headers: {'Accept': 'application/json'}}) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });
Output:
javascript
data: {code: 200, status: "success", title: "Thank You!", message: "We received your submission"}

Powered by Notaku