How to submit form without refreshing page using Django, Ajax, jQuery?

ajax, django, jquery

Solution

if you are planning to use an ajax submit with jquery you should not return html from your view.. I propose you to do this instead:

html:

<html>
<head>
</head>
<body>
    <h1>Leave a Suggestion Here</h1>
        <div class="message"></div>
        <div>
            <form action="" method="post">{% csrf_token %}
                {{ form.as_p }}
                <input type="submit" value="Submit Feedback" />
            </form>
        </div>
</body>
</html>

the js

$('#form').submit(function(e){
    $.post('/url/', $(this).serialize(), function(data){ ... 
       $('.message').html(data.message);
       // of course you can do something more fancy with your respone
    });
    e.preventDefault();
});

the views.py

import json
from django.shortcuts import *
from django.template import RequestContext
from linki.forms import *

def advert(request):
    if request.method == "POST":
        form = AdvertForm(request.POST)

        message = 'something wrong!'
        if(form.is_valid()):
            print(request.POST['title'])
            message = request.POST['title']

        return HttpResponse(json.dumps({'message': message}))

    return render_to_response('contact/advert.html',
            {'form':AdvertForm()}, RequestContext(request))

so that way you put the response in the `message` div. instead of returning plain html you should return json.

Problem

I am newbie working with django. I need simple example. How to submit form (post) without refreshing page using Django, Ajax, jQuery? This is my form, views and template: views.py ``` from django.shortcuts import * from django.template import RequestContext from linki.forms import * def advert(request): if request.method == "POST": form = AdvertForm(request.POST) if(form.is_valid()): print(request.POST['title']) message = request.POST['title'] else: message = 'something wrong!' return render_to_response('contact/advert.html', {'message':message}, context_instance=RequestContext(request)) else: return render_to_response('contact/advert.html', {'form':AdvertForm()}, context_instance=RequestContext(request)) ``` forms.py (form using "ModelForm") ``` from django import forms from django.forms import ModelForm from linki.models import Advert class AdvertForm(ModelForm): class Meta: model = Advert ``` TEMPLATES (form html code) ``` <html> <head> </head> <body> <h1>Leave a Suggestion Here</h1> {% if message %} {{ message }} {% endif %} <div> <form action="" method="post">{% csrf_token %} {{ form.as_p }} <input type="submit" value="Submit Feedback" /> </form> </div> </body> </html> ```

Original source