Simple and painless form processing for static sites.
Project description
Simple and painless form processing for static sites.
Why?
I have several sites hosted on AWS S3 for pennies a month… and I didn’t want to pay $20 per month (per form) for processing contact forms!
20+ domains powered by 1 Heroku app = Profit!
Demo
Features
Multi site support.
Unlimited forms
Unlimited submissions
Spam Protection via Akismet.
Submit forms with AJAX.
REST API to manage forms.
Quickstart
Install django-fwdform:
pip install django-fwdform
Add fwdform to INSTALLED_APPS:
INSTALLED_APPS = ( ... 'corsheaders', 'fwdform', ... )
Sync database:
python manage.py migrate
Add fwdform.urls to your project’s urls module:
urlpatterns = patterns( ... url(r'^', include('fwdform.urls', namespace='fwdform')), ... )
Dependencies
This package requires django-cors-headers to be installed and configured correctly. When django-fwdform is installed using pip, django-cors-headers is automatically installed.
You will need to add corsheaders middleware class to MIDDLEWARE_CLASSES settings:
MIDDLEWARE_CLASSES = ( ... 'corsheaders.middleware.CorsMiddleware', 'django.middleware.common.CommonMiddleware', ... )
Note that CorsMiddleware needs to come before Django’s CommonMiddleware.
Allow CORS requests from all domains:
CORS_ORIGIN_ALLOW_ALL = True
For more information, see https://github.com/ottoyiu/django-cors-headers
Sample Form
<form action="//example.com/send/<form_hash>/" method="POST"> <input type="text" name="name" required="required"/> <input type="email" name="email" required="required" /> <textarea name="message" rows="5"></textarea> <input type="submit" value="Send"> </form>
Special Form Inputs
_next
By default, after submitting a form the user is shown the FwdForm “Thank You” page. You can provide an alternative URL for that page.
<input type="hidden" name="_next" value="//example.com/thanks.html" />
_subject
This value is used for the email’s subject:
<input type="hidden" name="_subject" value="Contact Form" />
_gotcha
Add this “honeypot” field. If a value is provided, the submission will be silently ignored. The input should be hidden with CSS:
<input type="text" name="_gotcha" style="display:none;" />
name/email/message
Span prevention via Akismet - Spam checker backend looks for these specially named form inputs:
<input type="text" name="name" placeholder="Your Name"> <input type="email" name="email" placeholder="Your Email"> <textarea name="message" rows="5"></textarea>
Rest API
Register a form, this returns a hashid for the newly created form:
$ curl --data "name=Contact%20Form&recipients=conttact@example.com" http://example.com/<site_token>/ {"hashid": "0rPGVlYZWqMRE8OebjoM1ogpmvNL23A9dxJzywQD"}
Update existing form config by passing a known hashid as a param:
$ curl --data "recipients=hello@example.com&hashid=0rPGVlYZWqMRE8OebjoM1ogpmvNL23A9dxJzywQD" http://example.com/<site_token>/
AJAX Submission
You can use fwdform via AJAX. This even works cross-origin.
If you’re using jQuery this can be done like so:
$.ajax({ url: $form.attr("action"), method: "POST", data: $form.serialize(), dataType: "json", headers: {"X-Requested-With": "XMLHttpRequest"}, });