I can't pass values to database with Ajax and Django

i'm new in Ajax and Django i'm try sent videoP1 = 1 when percentage = 100 i'm use script tag on html to write js To get videoP1-videoP17 from database via views.py to set value in array and call it.

var videos = [
  {
    id: 1,
    name: "1",
    src: "../static/frontend/video/1.mp4",
    videoP1: {{ video_db.videoP1 }},

  },
  {
    id: 2,
    name: "2",
    src: "../static/frontend/video/2.mp4",
    videoP2:  {{ video_db.videoP2 }},
  },
  {
    id: 17,
    name: "17",
    src: "../static/frontend/video/17.mp4",
    videoP17:  {{ video_db.videoP17 }},

  },
];
var player = videojs("videoP");
    
function light(Cvideo) {
    for (let i = 0; i < videos.length; i++) {
        let video = videos[i];
        if (videos[i].id === Cvideo) {
            document.getElementById("nameV").innerHTML = videos[i].name;
            player.src({ type: "video/mp4", src: videos[i].src });
            player.play();
            if (!video["videoP" + (i + 1)]) {
                player.controlBar.progressControl.hide();
            player.on("timeupdate", function() {
                var percentage = (player.currentTime() / player.duration()) * 100;
                document.getElementById("percentage").innerHTML =
                Math.round(percentage) + "%";
                if (percentage === 100) {
                    video["videoP" + (i + 1)] = 1;
                    var videopro = video["videoP" + (i + 1)] = 1;
                    
                    $.ajax({
                        type: "POST",
                        url: "/update-video-progress/",
                        data: {
                          video_id: video.id,
                          videoPro: videopro,
                        },
                        success: function(response) {
                          console.log("Video progress updated");
                         
                        },
                        error: function(xhr, textStatus, errorThrown) {
                          console.error("Failed to update video progress");
                        
                        },
                      });
                    return;
                }
            });
        } else {
            player.controlBar.progressControl.show();
        }
         break;
        }
    }
}
<video id="videoP" class=" video-js vjs-fluid" controls data-setup='{}'>
  <source src="../static/frontend/video/selectV.mp4" type="video/mp4">
</video>
<p id="percentage"class="hide_percent" >0</p>

<a href="#" class="nav-link  ms-3" id="videoLink1"onclick="light(1)">1</a>
<a href="#" class="nav-link  ms-3" id="videoLink2" onclick="light(2)">2</a>
<a href="#" class="nav-link  ms-3" id="videoLink17" onclick="light(17)">17</a>
this my views.py in my Django project to get the value and save to database and urls.py is path("save-data/", views.save_data, name="save-data"),

@csrf_exempt
def update_video_progress(request):
    if request.method == "POST":
        video_id = request.POST.get("video_id")
        videoPro = request.POST.get("videoPro")
        videoDB = VideoDB.objects.get(videoPro)
        videoDB = videoPro
        videoDB.save()
        return JsonResponse({"message": "Video progress updated"})

def getDB(request):
    video_db = VideoDB.objects.get(pk=5)
    return render(request, 'User-page.html', {'video_db': video_db})

from django.db import models

 class User(models.Model):
  u_id = models.AutoField(primary_key=True)
  name = models.CharField(max_length=100)
  correctAnswers = models.IntegerField()
  percentage = models.IntegerField(default=0)

  def __str__(self):
    return self.name

 class VideoDB(models.Model):
  u_id = models.ForeignKey(User, on_delete=models.CASCADE, related_name='videodb')
  videoP1 = models.IntegerField(default=0)
  videoP2 = models.IntegerField(default=0)
  videoP17 = models.IntegerField(default=0)

  def __str__(self):
   return str(self.u_id)

and this my models.py for create database

Back to Top