Skip to main content
Join the official 2019 Python Developers SurveyStart the survey!

Pagination, xhr and tabbing utilities for the Django framework.

Project description

A few utilities for making pagination and tabbing easier. Everything should work with and without javascript. If javascript is enabled, several features like preloading can be obtained.

Currently, we have:
  1. pagination
  2. tabbing
  3. xhr: for loading a part of the page delayed through AJAX, when it is heavy
    to render.
DEPENDENCIES:

1. Tabbing

In the template:

> {% load ajax_utilities %} > {% tabpage %} > {% tabs %} > <ul> > <li class=”selected”><a href=”…”>…</a></li> > <li class=”“><a href=”…”>…</a></li> > <li class=”“><a href=”…”>…</a></li> > </ul> > {% endtabs %} > {% tabcontent %} > {% block tab_content %} > inherit this template and fill in the tab content by creating a block named ‘tab_content’. > {% enblock %} > {% endtabcontent %} > {% endtabpage %} > > <script type=”text/javascript” src=”{{ STATIC_URL }}js/ajax-utilities/tabbing.js”></script>

This is usually the base template. Every tab matches a separate view, which renders a template, derived from this base template. It will fill in the block tab_content, and mark the tab as “selected”.

If you want a link inside a tab page to be opened inside the same tab, use the tabbing-helper-class:

> <a class=”tabbing-helper” href=”…”> (something which opens in this tab) </a>

In Javascript:

> function handler(e, containers) > { > // code to be excuted when the paginator switches from page … > // containers is an Array of elements (jquery items) where content may have been changed. > } > $(document).bind(‘tabLoaded’, handler);

1. xhr

This is an AJAX optimazation for heavy web pages. The {% xhr %} template tags marks a section of the template to be rendered during a later XML HTTP Request (AJAX).

So, actually, every view which template contains {% xhr %} is rendered twice. First without the slow, heavy content, where a placeholder <div> is inserted, and later on, rendering everything.

Insert the following scripts to your HTML:

> <script type=”text/javascript” src=”{{ STATIC_URL }}/js/ajax-utilities/xhr.js”></script>

Mark the slow parts with {% xhr %}:

> {% load xhr %} > … some content … > > {% xhr %} > Very slow content > {% else %} > Loading, … (insert loading message or images, … here) > {% endxhr %} > > … some content …

The {% else %} part can be omitted, or it can contain a loading message.

If the slow content depends on calculations in the view, which are not necessary for the other content. Make sure to not execute them during the first run in the view:

> def view(request): > if ‘xhr’ in request.REQUEST: > do_slow_calculations() > > return …

In Javascript:

> function handler() > { > … (code to be excuted when the xhr content has been loaded) … > $(‘.xhr_container’).each(function () { … } ); > } > $(document).bind(‘xhrLoaded’, handler);

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for django-ajax-utilities, version 1.2.9
Filename, size File type Python version Upload date Hashes
Filename, size django_ajax_utilities-1.2.9-py2.py3-none-any.whl (64.7 kB) File type Wheel Python version 2.7 Upload date Hashes View hashes
Filename, size django-ajax-utilities-1.2.9.tar.gz (8.0 kB) File type Source Python version None Upload date Hashes View hashes

Supported by

Elastic Elastic Search Pingdom Pingdom Monitoring Google Google BigQuery Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN SignalFx SignalFx Supporter DigiCert DigiCert EV certificate StatusPage StatusPage Status page