Django Datatables - Pagination, Search and Inline edit via Ajax

Hello Coders,

This article presents an open-source Django project that provides a simple Datatable control enhanced with pagination, search, and inline edit via Ajax activated when the user clicks the table row. Django Datatables Sample loads the information via the admin interface from a sample CSV file.

For newcomers, Django is a Python Web framework built by experienced developers that encourages rapid development.

• 👉 Django Datatables Sample - source code
• 👉 (Free) Django Bootstrap 5 - the initial starter

How to compile the app

$ # Get the code
$ git clone https://github.com/app-generator/django-datatables-sample.git
$ cd django-datatables-sample

Once you get the code, we need to install the dependencies and create the tables:

$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Storage
$ pip3 install -r requirements.txt
$
$ # Create tables
$ python manage.py makemigrations
$ python manage.py migrate

The sample information provided in a CSV file can be loaded with ease via admin interface and django-import-export package. To get access to the admin section, please create a superuser first:

$ # Create app superuser
$ python manage.py createsuperuser

Load Data For Datatables

In Django admin, you can import data for the Transaction section.
To do this just click on IMPORT button then select your csv, xls or etc file and submit it.

Sample Data

Datatable for transactions

Imported information is displayed on the Transactions page.

Once we have the information in the database, on the page we can search, edit, and delete the transactions:

• Information is paginated to navigate with ease: PREV, 1,2,3., NEXT controls
• Search box to filter transactions by name
• Delete row control
• Edit cell data on double click and ENTER on confirm.

Based on the permissive (MIT) license, the project code can be copied and used for hobby & commercial projects.

Thanks for reading! For more resources, please access:

• 👉 Django - official website
• 👉 More Django Dashboards - generated by AppSeed