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

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

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

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

jQuery ajax get request method example

### jQuery Ajax Get Request Method Example This article is originally published at [https://www.tutsmake.com/jquery-api-ajax-get-method-example/](https://www.tutsmake.com/jquery-api-ajax-get-method-example/...

Django 2 Ajax CRUD with Python 3.7 and jQuery

In this tutorial, you'll learn how to send Ajax requests in Django 2 and Python 3.7 to add CRUD operations in your application and manipulate your Django models and database without having to refresh your web pages each time.

Laravel 7 Ajax Dynamic Dependent Dropdown

In this laravel tutorial, you will learn how to build dynamic dependent dropdown using ajax in laravel apps. In this dynamic dependent dropdown example, you will learn how to show selected subcategories dependent on selected category dropdown using jquery ajax. InRead More Laravel 7 Dynamic Dependent Dropdown Using Ajax Example

Main Pros and Cons of Django As A Web Framework for Python Developers

India's best Institute for Django Online Training Course & Certification. Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design.

Crop and Resize Image Before Upload In Laravel Using with jQuery Copper JS

Crop image before upload in laravel. Here, we will show how to crop image before upload in DB & folder using jquery cropper js in laravel.