django 1.3 ajax contact form post using jQuery

contact-us-fields.html

<!-- this will be requested and rendered via ajax so we only want the form fields
so we can replace them later using jQuery with the fields PLUS the errors. -->
<div id="form-fields">
{{ form.as_p }}
</div>

contact.js

$().ready(function() {
    var form = $("#contact-form");
    form.submit(function(e) {
        $("#send-button").attr('disabled', true);
        $("#wait-message").prepend('<span>Sending message, please wait... </span>');
        $.post(
            form.attr('action'),
            form.serializeArray(),
            function(data) {
                if(data.is_valid){
                    $("#send-button").hide();
                    $('#form-fields').empty();
                    $('#thank-you').html(data.html);
                } else {
                    $("#send-button").attr('disabled', false);
                    $('#form-fields').html(data.html);
                }
                $("#wait-message").empty();
            }
        );
        e.preventDefault();
    });
});

the-form.html

<form action="{% url main_view %}" method="post" id="contact-form">{% csrf_token %}
{% include "djangocontactus/contact-us-fields.html" %}
<input type="submit" value="Submit" id="send-button" name="send-button" />
<div id="wait-message"></div>
</form>

views.py

# -*- coding: utf-8 -*-
from django.core.mail import EmailMessage
from django.http import HttpResponse
from django.shortcuts import render
from django.template.loader import render_to_string

import simplejson as json

from djangocontactus.forms import ContactForm


def _send_email(form, template):
    # The form param should be an instance of form.cleaned_data
    message_body = render_to_string(template, form)
    email = EmailMessage(
        form['subject'],
        message_body,
        form['sender'],
    )
    email.send()

def contact_us(request):
    template = 'djangocontactus/{0}'
    if request.method == 'GET':
        return render(
            request,
            template.format('contact-us-form.html'),
            {'form': ContactForm()}
        )
    form = ContactForm(request.POST)
    if form.is_valid():
        _send_email(
            form.cleaned_data,
            template.format('email-contact-us.html')
        )
        html = render_to_string(template.format('thank-you-message.html'))
    else:
        html = render_to_string(
            template.format('contact-us-fields.html'),
            {'form': form}
        )
    json_dump = json.dumps({'html': html, 'is_valid': form.is_valid()})
    return HttpResponse(json_dump, status=200, mimetype='application/json')

Partysun: I'm working on creating a project here on github at the moment that will include the form code. I would put the form code up, but its been changed quite a bit as part of another project and it might not make much sense here. If you create a div around your form fields with id="form-fields", the AJAX goodness should work for whatever fields you're wanting to include. Sorry for any confusion! I'll have a fully-working project up soon :)

hi i am using your code but when form is invalid so is return all fields but not render ReCaptchaField()

i am use ReCaptchaField() in form

how can i render field in template
please help
thanks in advance