Django Python Sweet Alert Confirm Delete Example
Hi Dev,
I will explain step by step tutorial django python sweet alert confirm delete tutorial. you can understand a concept of django sweet alert confirm delete tutorial button. if you want to see example of how to use django sweet alert confirm delete tutorial then you are a right place. it's simple example of django python sweet alert js confirm delete example. you will do the following things for django sweet alert box using data delete in table.
Here i explained simply step by step it's simple example of django python sweet alert js confirm delete example.
Step 1 : Create a ProjectIn this step, we’ll create a new django project using the django-admin. Head back to your command-line interface and run the following command:
django-admin startproject exampleStep 2 : Create a App
python3 manage.py startapp sweetAlertStep 3 : Update setting.py
In this step we require to do two things in our settings.py file, One is to change the path of template look up directory. Second one is to configure our media folder. Add the below lines to your settings.py file:
Next, you need to add it in the settings.py file as follows:
import os
....
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'sweetAlert',
]
Step 4 : Database Setup
Next step, we will modify the settings.py file and update the database settings to configure the mydb database:
settings.py
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'example',
'USER':'root',
'PASSWORD':'root',
'HOST':'localhost',
'PORT':'3306'
}
}
Step 5 : Creating the Views
In this step, we need to create the views for performing fetch record to the database.Open the sweetAlert/views.py file and add:
sweetAlert/views.py
from django.shortcuts import render
from django.http import HttpResponse, HttpResponseRedirect
from django.template import loader
from django.urls import reverse
from .models import Post
# Create your views here.
# Listing Page
def index(request):
posts = Post.objects.all()
return render(request, 'index.html', { 'posts': posts })
# Delete Post
def delete(request, id):
post = Post.objects.get(id=id)
post.delete()
return HttpResponseRedirect(reverse('index'))
Step 6 : Creating Templates
Next, open the sweetAlert/templates/index.html file and the add:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
</head>
<body>
<div class="container mt-5">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<div class="row">
<div class="col-md-12">
<h3>Django Python Sweet Alert Confirm Delete Tutorial - <span class="text-primary">Tuts-Station.com</span></h3>
</div>
</div>
</div>
<div class="card-body">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th width="150">Title</th>
<th width="200">Content</th>
<th width="80">Action</th>
</tr>
</thead>
<tbody>
{% for post in posts %}
<tr>
<td>{{ post.title }}</td>
<td>{{ post.description }}</td>
<td>
<form method="POST" action="{% url 'delete' post.id %}">
{% csrf_token %}
<input name="_method" type="hidden" value="DELETE">
<button type="submit" class="btn btn-xs btn-danger btn-flat show_confirm" data-toggle="tooltip" title='Delete'>Delete</button>
</form>
</td>
</tr>
{% empty %}
<tr class="text-center">
<td colspan="4">There are no Record Found!</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript">
$('.show_confirm').click(function(event) {
var form = $(this).closest("form");
var name = $(this).data("name");
event.preventDefault();
swal({
title: `Are you sure you want to delete this record?`,
text: "If you delete this, it will be gone forever.",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
if (willDelete) {
form.submit();
}
});
});
</script>
</html>
Step 7 : Creating Urls
In this section, we’ll create the urls to access our views.Go to the urls.py sweetAlert/urls.py file and update it as follows:
example/urls.py
from django.contrib import admin
from django.urls import path
urlpatterns = [
path('admin/', admin.site.urls),
path('', index, name = 'index'),
path('delete/<int:id>', delete, name='delete'),
]
Run the Server
In this step, we’ll run the local development server for playing with our app without deploying it to the web.
python manage.py runserver
Next, go to the http://localhost:8000/ address with a web browser.
I Hope It will help you....