How to create user status active deactivate toggle button in Django? - django

Question

I want something like this in my Django .
enter image description here
Can anyone tell me how should I code in html template and views.py ?

Answer 1

If you want to change the boolean field value status on click, you need to use Jquery.
I created an app named toggle, so you need to replace it with your app's name and is_working with your status button.
here is the full code
urls.py::
from django.urls import path
from toggle.views import home, toggle
urlpatterns = [
path('', home),
path('toggle/', toggle),
]
views.py:
from django.shortcuts import render
def home(request):
w, created = Work_Experience.objects.get_or_create(id=1)
return render(request,'home.html', {'workexperiance': w})
from django.http import HttpResponse
from toggle.models import Work_Experience
def toggle(request):
w = Work_Experience.objects.get(id=request.POST['id'])
w.is_working = request.POST['isworking'] == 'true'
w.save()
return HttpResponse('success')
home.html:
<div style="display:inline-block">
<label>Currently working here?</label>
<label class="switch">
<input type="checkbox" id="checkbox" value="{{workexperiance.is_working}}">
<span class="slider round"></span>
</label>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <!-- Import Jquery Here-->
<script type="text/javascript">
$(document).ready(function() {
$('#checkbox').change(function() {
$.post("/toggle/", {
id: '{{workexperiance.id}}',
isworking: this.checked,
csrfmiddlewaretoken: '{{ csrf_token }}'
});
});
});
</script>
run: ./manage.py runserver and visit: http://localhost:8000
when you click the Currently working here? check box, will instantly change the boolean field value "is_working".
reference to originally answered question :
Originally answered link