How to use ajax in django,to pass the model object and store it in database without refreshing the page?

i'm doing a small project in django,in that i thought of adding a favorite button in one of the pages so that on clicking on that button it has to return the model object and it has to be stored in another database for the reference,but its not happening Here is my home/bookdetails.html

  <!DOCTYPE html>

{% extends ‘home/Base.html’ %}

{% block title %} Book Details {% endblock %}
{% load staticfiles %}

<link rel=“stylesheet” href=“{{ STATIC_URL }}/home/css/heart.css”>
<script src=“{% static ‘js/heart.css’ %}”></script>
<script src=“https://code.jquery.com/jquery-3.1.0.min.js”></script>
<script src=“{% static ‘js/app.js’ %}”></script>

{% block body %}

{% if error_message %}<p><strong> {{ error_message }} </strong></p>{% endif %}
<script type=“text/javascript”>
$(document).ready(function(){
$(“#sub”).click(function(event) {
var userbooks = ‘{{ userbooks }}’;
$.ajax({
type: “GET”,
url: “{% url ‘home:favoriteAjax’ %}”
data:{userbbooks:userbooks}
datatype:‘json’
success: function() {
alert(“successfully added to favorites”)
}
}
});
});
});

</script>
<p>Book name:{{ userbooks.book_name }}</p><br>
<p>Book author:{{ userbooks.book_author }}</p><br>
<p>Book genre:{{ userbooks.book_genre }}</p><br>
<p>Book ISBN:{{ userbooks.book_ISBN }}</p><br>
<button type=“submit” id=“sub” onclick=“changeText()”>Favourite</button>

{% endblock %}

my urls.py:

from django.urls import path
from . import views
app_name=‘home’
urlpatterns=[
path(‘’,views.HomeView,name=‘home’),
path(‘addBooks/’,views.addBooks,name=‘addBooks’),
path(‘myBooks/’,views.BooksView.as_view(),name=‘myBooks’),
path(‘<int:pk>/’, views.BookDetailsView.as_view(), name=‘myBooks’),
path(‘search/’, views.SearchedBooks.as_view(), name=‘searchedBooks’),
path(‘favorite_ajax/’, views.favorite_ajax, name=‘favoriteAjax’),
]

my models.py:

from django.db import models
from django.contrib.auth.models import User
class UserBooks(models.Model):
user_id = models.ForeignKey(User,on_delete=models.CASCADE,null=True)
username = models.CharField(max_length=200)
book_name = models.CharField(max_length=200)
book_author = models.CharField(max_length=200)
book_ISBN=models.CharField(max_length=200)
book_genre = models.CharField(max_length=200)
book_status=models.BooleanField(default=False)
class Meta:
unique_together = ((“username”, “book_ISBN”),)
def str(self):
return self.book_name

class FavBooks(models.Model):
user_id = models.ForeignKey(User,on_delete=models.CASCADE,null=True)
book_id= models.ForeignKey(UserBooks,on_delete=models.CASCADE,null=True)
class Meta:
unique_together = ((“user_id”, “book_id”),)

my views.py:

def favorite_ajax(request):
if(request.method==‘GET’):
book=request.GET[‘userbooks’]
fav=FavBooks()
fav.book_id=book
fav.user_id=request.user
fav.save()
return HttpResponse(“done”)

i want to take the userbooks model object from the bookdetails.html through ajax call and want to store that reference in the FavBooks model how could i make it happen?

#jquery #ajax #django

3 Likes85.95 GEEK