Add a feedback form with ratings, categories, and AJAX submission to any website or app. No server code needed. Get actionable insights from your users in minutes.
Create Free Feedback EndpointA complete feedback form with a 1-5 rating scale, category dropdown, and message field. Replace YOUR_ENDPOINT_ID with your FormCatch endpoint.
<form
action="https://formcatch.vercel.app/api/f/YOUR_ENDPOINT_ID"
method="POST"
style="max-width: 480px; margin: 0 auto; font-family: system-ui, sans-serif;"
>
<!-- Rating -->
<div style="margin-bottom: 16px;">
<label style="display: block; margin-bottom: 8px; color: #374151; font-size: 14px; font-weight: 600;">
How would you rate your experience?
</label>
<div style="display: flex; gap: 8px;">
<label style="cursor: pointer;">
<input type="radio" name="rating" value="1" required style="display:none;" />
<span style="display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; border:1px solid #d1d5db; border-radius:8px; font-size:18px;">1</span>
</label>
<label style="cursor: pointer;">
<input type="radio" name="rating" value="2" style="display:none;" />
<span style="display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; border:1px solid #d1d5db; border-radius:8px; font-size:18px;">2</span>
</label>
<label style="cursor: pointer;">
<input type="radio" name="rating" value="3" style="display:none;" />
<span style="display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; border:1px solid #d1d5db; border-radius:8px; font-size:18px;">3</span>
</label>
<label style="cursor: pointer;">
<input type="radio" name="rating" value="4" style="display:none;" />
<span style="display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; border:1px solid #d1d5db; border-radius:8px; font-size:18px;">4</span>
</label>
<label style="cursor: pointer;">
<input type="radio" name="rating" value="5" style="display:none;" />
<span style="display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; border:1px solid #d1d5db; border-radius:8px; font-size:18px;">5</span>
</label>
</div>
</div>
<!-- Category -->
<div style="margin-bottom: 16px;">
<label style="display: block; margin-bottom: 4px; color: #374151; font-size: 14px;">
Category
</label>
<select
name="category"
required
style="width: 100%; padding: 10px 14px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; background: white;"
>
<option value="">Select a category</option>
<option value="bug">Bug Report</option>
<option value="feature">Feature Request</option>
<option value="improvement">Improvement</option>
<option value="praise">Praise</option>
<option value="other">Other</option>
</select>
</div>
<!-- Message -->
<div style="margin-bottom: 16px;">
<label style="display: block; margin-bottom: 4px; color: #374151; font-size: 14px;">
Your feedback
</label>
<textarea
name="message"
required
rows="4"
placeholder="Tell us what you think..."
style="width: 100%; padding: 10px 14px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; resize: vertical;"
></textarea>
</div>
<!-- Email (optional) -->
<div style="margin-bottom: 16px;">
<label style="display: block; margin-bottom: 4px; color: #374151; font-size: 14px;">
Email (optional, for follow-up)
</label>
<input
type="email"
name="email"
placeholder="you@example.com"
style="width: 100%; padding: 10px 14px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px;"
/>
</div>
<input type="text" name="_honeypot" style="display: none;" />
<button
type="submit"
style="width: 100%; padding: 12px; background: #3b82f6; color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer;"
>
Send Feedback
</button>
</form>Use JavaScript fetch() to submit feedback without leaving the page. Perfect for SaaS apps and SPAs.
const form = document.getElementById('feedback-form');
form.addEventListener('submit', async (e) => {
e.preventDefault();
const data = new FormData(form);
try {
const res = await fetch(
'https://formcatch.vercel.app/api/f/YOUR_ENDPOINT_ID',
{
method: 'POST',
body: data,
}
);
if (res.ok) {
// Show success message
form.innerHTML = '<p style="text-align:center;color:#22c55e;font-weight:600;">Thank you for your feedback!</p>';
} else {
alert('Something went wrong. Please try again.');
}
} catch (err) {
alert('Network error. Please check your connection.');
}
});Any app that needs user feedback without the overhead of building a backend.
Add an in-app feedback widget. Let users report bugs, request features, and share suggestions without leaving your app.
Lightweight AJAX form that works on any screen size. No SDK, no dependency — just a fetch() call.
Collect feedback from your team on internal dashboards and tools. Track what needs fixing and what works well.
Post-purchase feedback, content ratings, and user satisfaction surveys. Export data for analysis.
Free plan includes 3 endpoints and 100 submissions per month. No credit card required.
Yes. FormCatch supports AJAX/fetch submissions. Use the JavaScript example on this page to submit feedback without leaving the current page, and show a success message inline.
Yes. FormCatch accepts any form field. Add rating inputs, select dropdowns, checkboxes, or any HTML input — all data is captured and visible in your dashboard.
Absolutely. FormCatch works with any frontend. Use fetch() or axios to POST to your endpoint. See our docs for React, Vue, and Svelte integration guides.
Export all submissions as CSV from your dashboard. You can then analyze in Excel, Google Sheets, or any BI tool. Filter by date, category, or rating in the FormCatch dashboard.
Explore more use cases