Program 10

Develop a registration page for student enrolment as done in Module 2 but without page refresh using AJAX.

views.py

from django.shortcuts import render
from django.http import JsonResponse,HttpResponse
from .forms import StudentForm
from .models import Course

# Create your views here.


def insertcourse(request):
    c1=Course(cid='21CS61',cname='SEPM')
    c2=Course(cid='21CS62',cname='FD')
    c3=Course(cid='21CS63',cname='CG')
    c4=Course(cid='21CS641',cname='AJJ')
    c5=Course(cid='21CS642',cname='DSV')
    for x in [c1,c2,c3,c4,c5]:
        x.save()
    return HttpResponse("insertion of course data successful")

def registration_page(request):
    form = StudentForm()
    return render(request, 'student.html', {'form': form})

def register_student(request):
    if request.method == 'POST':
        form = StudentForm(request.POST)
        if form.is_valid():
            form.save()
            return JsonResponse({'success': True})
        else:
            return JsonResponse({'success': False, 'errors': form.errors})
    return JsonResponse({'success': False, 'errors': 'Invalid request'})

urls.py

from django.urls import path
from .views import register_student,registration_page,insertcourse

urlpatterns = [
    path('course',insertcourse),
    path('register/',registration_page, name='registration_page'),
    path('register_student/',register_student, name='register_student'),
]

models.py

from django.db import models

# Create your models here.
class Course(models.Model):
     cid=models.CharField(max_length=10, primary_key=True)
     cname=models.CharField(max_length=30)
     def __str__(self):
          return self.cname

class Student(models.Model):
    usn=models.CharField(max_length=10, primary_key=True)
    name=models.CharField(max_length=30)
    sem=models.IntegerField()
    courses=models.ManyToManyField(Course)
    

forms.py

from django import forms
from .models import Student, Course

class StudentForm(forms.ModelForm):
    class Meta:
        model = Student
        fields = ['usn', 'name', 'sem', 'courses']
        widgets = {
            'courses': forms.CheckboxSelectMultiple(),
        }
        

admin.py

from django.contrib import admin
from .models import Student, Course

# Register your models here.
class StudentAdmin(admin.ModelAdmin):
    list_display = ['usn', 'name', 'sem']
    list_filter = ['sem']
    search_fields = ['usn', 'name']
    filter_horizontal = ['courses']
    
admin.site.register(Student, StudentAdmin)
admin.site.register(Course)

templates/student.html

<!doctype html>
<html>
    <head>
        <title>Student Registration</title>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script>
            $(document).ready(function () {
                $("#registration-form").on("submit", function (event) {
                    event.preventDefault();

                    $.ajax({
                        url: '{% url "register_student" %}',
                        type: "POST",
                        data: $(this).serialize(),
                        success: function (response) {
                            if (response.success) {
                                $("#message").html(
                                    "<p>Registration successful!</p>",
                                );
                                $("#registration-form")[0].reset();
                            } else {
                                var errors = "";
                                for (var error in response.errors) {
                                    errors +=
                                        "<p>" +
                                        response.errors[error][0] +
                                        "</p>";
                                }
                                $("#message").html(errors);
                            }
                        },
                        error: function (error) {
                            $("#message").html(
                                "<p>An error occurred. Please try again.</p>",
                            );
                        },
                    });
                });
            });
        </script>
    </head>
    <body>
        <h1>Student Registration</h1>
        <div id="message"></div>
        <form id="registration-form" method="POST">
            {% csrf_token %} {{ form.as_p }}
            <button type="submit">Register</button>
        </form>
    </body>
</html>