Start collecting form submissions from your HTML form with FormAPI in 2 minutes. Create your form in FormAPI and paste your unique URL inside your form. Check out the code examples and detailed tutorial below to get started.
<form id="contactForm">
<label>Email:</label>
<input type="email" name="email" required />
<label>Message:</label>
<textarea name="message" required></textarea>
<button type="submit">Send</button>
</form>
<script>
const form = document.getElementById('contactForm');
form.addEventListener('submit', async function (e) {
e.preventDefault();
const formData = new FormData(form);
try {
const res = await fetch('https://submit.zunoy.com/sub/[YOUR-FORM-KEY]', {
method: 'POST',
body: formData
});
alert('Form submitted successfully!');
} catch (error) {
alert('Error: ' + error.message);
}
});
</script>HTML (HyperText Markup Language) is the standard language for creating web pages. With FormAPI, you can easily collect form submissions from your HTML forms without needing a backend.
Fetch is a built-in JavaScript API that allows you to send form data easily. Below is an example demonstrating how to send form submissions from an HTML form to FormAPI using Fetch. Ensure that you replace “https://submit.zunoy.com/sub/[YOUR-FORM-KEY]” with your unique endpoint URL.
<script>
function submitForm(event) {
event.preventDefault();
const email = document.getElementById('email').value;
const message = document.getElementById('message').value;
fetch('https://submit.zunoy.com/sub/[YOUR-FORM-KEY]', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email, message })
})
.then(response => response.json())
.then(data => {
if (data.code === 200) {
alert('Form submitted successfully!');
} else {
alert('Error: ' + data.message);
}
})
.catch(error => console.error('Error:', error));
}
</script>
<form onsubmit="submitForm(event)">
<input type="email" id="email" placeholder="Email" required />
<textarea id="message" placeholder="Message" required></textarea>
<button type="submit">Submit</button>
</form>Axios is a promise-based HTTP client that simplifies API requests. Below is an example showing how to send form submissions from an HTML form to FormAPI using Axios. Ensure that you replace “https://submit.zunoy.com/sub/[YOUR-FORM-KEY]” with your unique endpoint URL.
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
function submitForm(event) {
event.preventDefault();
const email = document.getElementById('email').value;
const message = document.getElementById('message').value;
axios.post('https://submit.zunoy.com/sub/[YOUR-FORM-KEY]', { email, message })
.then(response => {
if (response.data.code === 200) {
alert('Form submitted successfully!');
} else {
alert('Error: ' + response.data.message);
}
})
.catch(error => console.error('Error:', error));
}
</script>
<form onsubmit="submitForm(event)">
<input type="email" id="email" placeholder="Email" required />
<textarea id="message" placeholder="Message" required></textarea>
<button type="submit">Submit</button>
</form>To upload files in an HTML form using FormAPI, you can use FormData along with Axios or Fetch. The example below demonstrates how to handle file uploads in an HTML form. Ensure that you replace “https://submit.zunoy.com/sub/[YOUR-FORM-KEY]” with your own unique endpoint URL.
<script>
function uploadFile(event) {
const file = event.target.files[0];
if (!file) return;
const formData = new FormData();
formData.append('file', file);
fetch('https://submit.zunoy.com/sub/[YOUR-FORM-KEY]', {
method: 'POST',
body: formData
})
.then(response => response.ok ? alert('File uploaded successfully!') : alert('Upload failed.'))
.catch(error => console.error('Error:', error));
}
</script>
<input type="file" onchange="uploadFile(event)" />Select HTTPS monitoring to track website uptime, SSL expiry, redirects, and response codes from global locations.
Type your website URL, add optional headers or auth tokens, then pick the check interval you prefer.
We run the first check instantly and alert on downtime, SSL errors, or failed HTTPS responses.
USe CAses
A collection of example HTML forms with code that you can edit live, then download or copy/paste. A minimal form reset css is included that should work with most sites. A minimal form reset css is included that should work with most sites. A minimal form reset css is included that should work with most sites.
Copyright © 2025 - Mentcube Innovations Pvt Ltd. All Rights Reserved.
FormAPI