Как я могу получить доступ к полям модели Django в форме через JavaScript для автоматического вычисления fa ield?

Я хотел бы автоматически вычислять высоту суммы депозита в форме. Поэтому я включил JavaScript, чтобы сделать это. Идея: После ввода данных в форму, в поле суммы будет выведена подходящая высота депозита. И пользователю здесь ничего не нужно делать.

Я очень признателен за любые предложения, поскольку я полный новичок в Django.

Я пытался получить доступ к полю через известные методы, такие как netObj.fishing_type и ['fishing_type'], но мне кажется, что проблема не в этом. Почему-то я не могу получить доступ к полям модели сработавшей записи.

html файл

{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% block content%}
<p>  </p>

<div class ="form-group">
    <form method="POST" action="{% url 'put_deposit' %}" enctype="multipart/form-data"> 
        {% csrf_token %}
        {{form|crispy}}

        <script>
            // Get the input elements by targeting their id:
            const net_input = document.getElementById('id_net');
            const vessel_input = document.getElementById('id_vessel');
            const amount = document.getElementById('id_amount');
         
            // Create variables for what the user inputs, and the output:
            let netObj = 0;
            let vesselObj = 0;
            let height = 0;
        
            // Add an event listener to 'listen' to what the user types into the inputs:
            net_input.addEventListener('input', e => {
              netObj = e.target.value;
              console.log(netObj);

              updateAmount()
            });
        
            // Update the value of net based on what the user inputs in for gross and tier
            function updateAmount(e) {
                if ((Date.now() - netObj.prod_date)>3) {
                        height = 900;
                    } else {
                        height = 600;
                    }
                
                term = netObj['fishing_type];

                if(term == 'Surrounding' || term == 'Trawl'){
                    height = height *2;
                } else if(term == 'Longline' || term=='Seine' ){
                    height = height *1.5;
                } else{
                    height = height *1.25;
                }
                 
                amount.value = height;
            }
        </script>
        <button type="Submit" class="btn btn-outline-dark">Submit</button></div>

{% endblock content%}

Извлечение файла models.py

class Net(models.Model):
    net_id = models.IntegerField(primary_key=True, default = None)
    prod_date = models.DateField()
    weight = models.DecimalField(default=0, max_digits=6, decimal_places=2)
    material = models.CharField(max_length=100)
    fishing_type = models.CharField(max_length=100, default=None)
    
    def __str__(self):
       return '{}: {}'.format(self.fishing_type, self.material)

class Deposit(models.Model):
    dep_id = models.BigAutoField(primary_key=True, default=None)
    dep_date = models.DateField()
    harbour = models.CharField(max_length=100)
    vessel = models.ForeignKey(Vessel, to_field='VID', on_delete=models.CASCADE)
    net = models.ForeignKey(Net, to_field='net_id', on_delete=models.CASCADE)
    amount = models.DecimalField(default=0, max_digits=8, decimal_places=2)

forms.py

from django.forms import ModelForm
from myapp.models import *


class UploadForm(ModelForm):

    class Meta:
        model = Deposit
        fields = ['dep_date', 'harbour', 
                    'vessel', 'net', 
                    'amount']
Вернуться на верх