Django and Ajax - What can I do?

Question

I'm almost done with my site except for the last part where I need to make the gallery page support ajax to change the page number using Ajax.

Gallery pages view:

def gallerypages(request, page):
    items = Example.objects.all().order_by('-pk')
    categories = Categorie.objects.all()

    paginator = Paginator(items, 12)

    try:
       itemsList = paginator.page(page)
    except PageNotAnInteger:
       itemsList = paginator.page(1)
    except EmptyPage:
       itemsList = paginator.page(paginator.num_pages)

    if items.count()>1:
       return render_to_response('gallery.html', {'items': itemsList,'categories': categories,}, context_instance = RequestContext(request))

Dajax/Dajaxice are not very well documented... I only need to show some images.

Answer 1

Here's how to do it with Dajax/Dajaxice, which are meant to make AJAX easy in Django:

1. Install Dajaxice and Dajax per the documentation. The docs don't seem to mention it, but you can also use pip, i.e.

   pip install django-dajaxice
   pip install django-dajax
   

   to the get the libraries. In any case, make sure to follow the doc instructions to install the Django apps and get the necessary Javascript libraries loaded into gallery.html. (Note you need to have jQuery or a similar JS framework installed for Dajax to work.)

2. In gallery.html, isolate the section where the items and categories are rendered into HTML. Copy this section into a separate Django template called, say, gallery_content.html and then replace the section in gallery.html with a blank <div> with a specific id, e.g.

   <div id="gallery-content"></div>
   

   What you are doing is creating #gallery-content as a placeholder for the HTML that will be generated later for each page via a Dajaxice call.

3. Now, elsewhere in gallery.html, create a way for the user to tell you what page to go to, e.g.

   <input id="page-number">
   <button onclick="Dajaxice.myapp.gallerypages_content(Dajax.process, {'page': document.getElementById('page-number').value})">Go to page</button>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
   

   The Javascript onclick code -- which is called whenever the user clicks on the button element -- does two things: (1) grabs the value of the #page-number input element, and (2) sends it to the Django gallerypages_content view asynchronously, i.e. without a normal web browser page load, via the Dajaxice.myapp.gallerypages_content Javascript call. Note that myapp should be replaced with the name of your Django app.

4. Finally, you need to create the gallerypages_content view -- which is a variant of your existing gallerypages view modified to work with Dajaxice/Dajax. Dajaxice is hard-coded to look for such views in ajax.py, so create ajax.py in your myapp folder as follows:

   from django.template.loader import render_to_string
   from dajax.core import Dajax
   from dajaxice.decorators import dajaxice_register
   
   @dajaxice_register
   def gallerypages_content(request, page):
   
       page = int(page)
   
       # ... code to calculate itemsList and categories as before ...
   
       html = render_to_string('gallery_content.html',
                               {'items': itemsList,'categories': categories,}, 
                               context_instance = RequestContext(request))
       dajax = Dajax()
       dajax.assign('#gallery-content', 'innerHTML', html)
       return dajax.json()
   

   This is what the code above does: (1) converts the page parameter, which is now a string (i.e the raw string value of the #page-number input element), into a Python integer; (2) does the same calculation as before to get itemsList and categories; (3) uses render_to_string to render gallery_content.html to an HTML string instead of to the normal Django HTTP response; (4) uses the Dajax API to create an instruction to inject the HTML into the #gallery-content div; (5) and, as the view's response, returns these instructions in JSON format. The Dajaxice call in the onclick handler will in effect receive these instructions and act on them (strictly speaking, it's the Dajax.process callback that does this), causing the HTML to show up. Note that you need to decorate gallerypages_content with @dajaxice_register -- that helps Dajaxice hook everything together.

I haven't tested any of this specifically, but it's based on how I've gotten Dajaxice/Dajax to work for me and I hope it works for you -- or at least gets you started!

Answer 2

Should I use django-dajax or django-dajaxice?

In a word, No. I created these projects 4 years ago as a cool tool in order to solve one specific problems I had at that time.

These days using these projects is a bad idea.

https://github.com/jorgebastida/django-dajax/