Submitting form using a SmartForms form endpoint is a pretty common scenario, especially when using javascript frameworks such as Vue and React, or when using jQuery with Ajax. So we tested and made sure that our service would run smoothly and be simple to integrate with Javascript.
Below we’ll show some example usages with the jQuery Ajax, the Axios library and using the native javascript Fetch method.
Copy
/* Ajax request, works with files too! */
$("#myForm").submit(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: 'https://smartforms.dev/submit/FORM_ID',
crossDomain: true,
data: new FormData(this),
processData: false,
contentType: false,
headers: {
"Accept": "application/json"
}
}).done(function() {
alert('Thanks for messaging us!')
})
});
Copy
<form id="myForm" method="POST" enctype="multipart/form-data">
<!-- Form content, can include any input type, even files -->
</form>
<script>
const form = document.getElementById('myForm');
const formData = new FormData(form);
form.addEventListener('submit', function(e){
e.preventDefault()
axios({
url: 'https://smartforms.dev/submit/5d54579a1b187457df9dc8f4',
method: 'post',
config: { headers: {'Content-Type': 'multipart/form-data' }},
data: formData
}).then(response => {
alert('Thanks for submiting!')
})
})
</script>
Copy
<form id="myForm" method="POST" enctype="multipart/form-data">
<!-- Form content, can include any input type, even files -->
</form>
<script>
const form = document.getElementById('myForm');
const formData = new FormData(form);
form.addEventListener('submit', function(e){
e.preventDefault()
fetch('https://smartforms.dev/submit/FORM_ID', {
method: 'post',
headers: {
"Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
},
body: formData
}).then(response => {
alert('Thanks for submiting!')
})
})
</script>
If you have any kind of trouble just Contact us and we'll be happy to help you!
Power your forms with ease
You can use our service forever free, upgrade only if you need more features.
Using SmartForms with Javascript
