অ্যাসিনক্রোনাস কাজ করার সেরা উপায় অ্যাজ্যাক্স। যে কোনও ওয়েবসাইট বিল্ডিংয়ে অ্যাসিঙ্ক্রোনাস কল করা সাধারণ is আমরা জ্যাঙ্গোতে কীভাবে এজেএক্স বাস্তবায়ন করতে পারি তা শিখতে আমরা একটি সংক্ষিপ্ত উদাহরণ নেব। কম জাভাস্ক্রিপ্ট লেখার জন্য আমাদের jQuery ব্যবহার করা উচিত।
এটি পরিচিতির উদাহরণ, যা সবচেয়ে সহজ উদাহরণ, আমি এজেএক্সের বুনিয়াদি এবং জ্যাঙ্গোতে এর বাস্তবায়ন ব্যাখ্যা করতে ব্যবহার করছি। আমরা এই উদাহরণে পোস্ট অনুরোধ করা হবে। আমি এই পোস্টের একটি উদাহরণ অনুসরণ করছি: https://djangopy.org/learn/step-up-guide-to-implement-ajax-in-django
models.py
আসুন প্রথমে যোগাযোগের মডেল তৈরি করি, প্রাথমিক বিবরণ রাখি।
from django.db import models
class Contact(models.Model):
name = models.CharField(max_length = 100)
email = models.EmailField()
message = models.TextField()
timestamp = models.DateTimeField(auto_now_add = True)
def __str__(self):
return self.name
forms.py
উপরের মডেলটির জন্য ফর্ম তৈরি করুন।
from django import forms
from .models import Contact
class ContactForm(forms.ModelForm):
class Meta:
model = Contact
exclude = ["timestamp", ]
views.py
মতামতগুলি মূল ফাংশন-ভিত্তিক তৈরি দৃশ্যের সাথে অনুরূপ, তবে রেন্ডার দিয়ে ফিরে আসার পরিবর্তে, আমরা জসনরেসপন্স প্রতিক্রিয়া ব্যবহার করছি।
from django.http import JsonResponse
from .forms import ContactForm
def postContact(request):
if request.method == "POST" and request.is_ajax():
form = ContactForm(request.POST)
form.save()
return JsonResponse({"success":True}, status=200)
return JsonResponse({"success":False}, status=400)
urls.py
উপরের ভিউটির রুট তৈরি করা যাক।
from django.contrib import admin
from django.urls import path
from app_1 import views as app1
urlpatterns = [
path('ajax/contact', app1.postContact, name ='contact_submit'),
]
টেমপ্লেট
ফ্রন্টএন্ড বিভাগে সরিয়ে, ফর্মটি রেন্ডার করুন যা সিএসআরএফ_ টোকেন এবং জমা বোতামের সাথে বদ্ধ ফর্ম ট্যাগের উপরে তৈরি করা হয়েছিল। নোট করুন যে আমরা jquery লাইব্রেরি অন্তর্ভুক্ত করেছি।
<form id = "contactForm" method= "POST">{% csrf_token %}
{{ contactForm.as_p }}
<input type="submit" name="contact-submit" class="btn btn-primary" />
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
জাভাস্ক্রিপ্ট
আসুন এখন জাভাস্ক্রিপ্ট অংশ সম্পর্কে কথা বলা যাক, ফর্ম জমা উপর আমরা POST টাইপ এর এজাক্স অনুরোধ করছি, ফর্ম তথ্য গ্রহণ এবং সার্ভার দিকে প্রেরণ।
$("#contactForm").submit(function(e){
// prevent from normal form behaviour
e.preventDefault();
// serialize the form data
var serializedData = $(this).serialize();
$.ajax({
type : 'POST',
url : "{% url 'contact_submit' %}",
data : serializedData,
success : function(response){
//reset the form after successful submit
$("#contactForm")[0].reset();
},
error : function(response){
console.log(response)
}
});
});
জাঙ্গো দিয়ে এজেএক্সের সাথে সূচনা করার জন্য এটি কেবলমাত্র একটি প্রাথমিক উদাহরণ, আপনি যদি আরও বেশ কয়েকটি উদাহরণ দিয়ে ডাইভ পেতে চান তবে আপনি এই নিবন্ধটি দিয়ে যেতে পারেন: https://djangopy.org/learn/step-up-guide-to- বাস্তবায়ন-Ajax-ইন-জ্যাঙ্গো