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
Top comments (5)
Awesome 😁
Thank you! :)
This is something I might use in my projects. Also, the UI looks super.
Thanks! .. The UI is an open-source BS5 Kit - Volt Dashboard crafted by Themesberg
is it possible to paginate json data?