Вычисление полей ввода во время заполнения пользователем данных в форме - Django Model Form

У меня есть форма пользователя, через которую я могу сохранять данные в базу данных.

Я хочу, чтобы некоторые поля автоматически вычислялись во время заполнения формы.

Например, Масса нетто = Масса брутто - Масса яруса и тому подобное.

Я также хочу добавить кнопки RADIO для полей LOADING, UNLOADING, DEDUCTION и т.д., где значения будут вычисляться, когда пользователь выберет одну из указанных опций.

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

Я использую Django Model Form. Пожалуйста, помогите мне.

Models.py

class PaddyPurchase(models.Model):
    ref_no = models.IntegerField(primary_key='true')
    token_no = models.CharField(max_length=20, unique='true')
    agent_name = models.CharField(max_length=20)
    trip_no = models.IntegerField()
    date = models.DateField()
    vehicle_no = models.CharField(max_length=10)
    bora = models.IntegerField()
    katta = models.IntegerField()
    plastic = models.IntegerField()
    farmer_name = models.CharField(max_length=30)
    farmer_address = models.CharField(max_length=40)
    farm_mob = models.CharField(max_length=10)
    gross_weight = models.IntegerField()
    tier_weight = models.IntegerField()
    net_weight = models.IntegerField()
    bora_weight = models.IntegerField()
    suddh_weight = models.FloatField()
    loading = models.IntegerField()
    unloading = models.IntegerField()
    unloading_point = models.CharField(max_length=20)
    dharamkanta_man = models.CharField(max_length=10)
    rate = models.IntegerField()
    bardana = models.CharField(max_length=7)
    gross_total = models.IntegerField()
    deduction = models.IntegerField()
    kanta = models.IntegerField()
    hemali = models.IntegerField()
    our_vehicle_rent = models.IntegerField()
    agent_commission = models.IntegerField()
    other_amt = models.IntegerField()
    other_remarks = models.CharField(max_length=50)
    advance = models.IntegerField()
    net_total = models.IntegerField()


 # For returning data in ADMIN SITE
 def __str__(self):
     return 'PaddyPurchase'

Forms.py

class PaddyPurchaseForm(forms.ModelForm):
# Code for changing DATE FORMAT (from YYYY-MM-DD to DD-MM-YYYY)
date = forms.DateField(
    widget=forms.DateInput(format='%d%m%Y'),
    input_formats=['%d-%m-%Y']
)

class Meta:
    model = PaddyPurchase
    fields = ['ref_no',
              'token_no',
              'agent_name',
              'trip_no',
              'date',
              'vehicle_no',
              'bora',
              'katta',
              'plastic',
              'farmer_name',
              'farmer_address',
              'farm_mob',
              'gross_weight',
              'tier_weight',
              'net_weight',
              'bora_weight',
              'suddh_weight',
              'loading',
              'unloading',
              'unloading_point',
              'dharamkanta_man',
              'rate',
              'bardana',
              'gross_total',
              'deduction',
              'kanta',
              'hemali',
              'our_vehicle_rent',
              'agent_commission',
              'other_amt',
              'other_remarks',
              'advance',
              'net_total'
              ]

Viwes.py

def add_record(request):

if request.method == "POST":
    form = PaddyPurchaseForm(request.POST)
    if form.is_valid():
        form.save(commit=True)
        messages.success(request, "Data Saved Successfully. - Lucky")
        return index(request)
    else:
        messages.error(request, "Error!!!")
return redirect("index")

Эту проблему нужно решать с помощью JavaScript. Django может обрабатывать серверную сторону, но так как вы хотите, чтобы эти вычисления производились по мере того, как пользователь набирает или вводит информацию до ее отправки, вам нужен JavaScript для обработки клиентской стороны. Когда форма заполнена, вы можете отправить ее на сервер (представления), используя то, что уже есть в Django.

Итак, как это сделать с помощью JavaScript? Сначала присвойте каждому из входов идентификатор, чтобы вы могли обращаться к ним в сценарии JavaScript (JS), например, 

<input id='gross_weight' ...>
<input id='tier_weight' ...>
<input id='net_weight' ...>

Далее, используйте JS input event или change event для определения того, когда пользователь ввел значение, выполните вычисления, а затем обновите значения в вашей форме:

<script>
    // Get the input elements by targeting their id:
    const gross_input = document.getElementById('gross_weight');
    const tier_input = document.getElementById('tier_weight');
    const net_input = document.getElementById('net_weight');
 
    // Create variables for what the user inputs, and the output:
    let gross = 0;
    let tier = 0;
    let net = 0;

    // Add an event listener to 'listen' to what the user types into the inputs:
    gross_input.addEventListener('input', e => {
      gross = e.target.value;
      updateNet()
    });
    tier_input.addEventListener('input', e => {
      tier = e.target.value;
      updateNet()
    });

    // Update the value of net based on what the user inputs in for gross and tier
    function updateNet(e) {
        net = gross - tier;
        net_input.value = net;
    }
</script>

Когда пользователь отправляет форму, Django берет управление на себя.

Существует приложение django, которое облегчает вычисление во фронтенде, записывая выражение в определение виджета формы.

django-calculation Вы можете получить его с помощью:

pip install django-calculation

Пример того, как можно добиться вычисления, просто определив выражение в ModelForm.

from django import forms

# import your PaddyPurchase model
from .models import PaddyPurchase

# import the calculation module from django-calculation app
import calculation


class PaddyPurchaseForm(forms.ModelForm):
    # Code for changing DATE FORMAT (from YYYY-MM-DD to DD-MM-YYYY)
    date = forms.DateField(
        widget=forms.DateInput(format="%d%m%Y"), input_formats=["%d-%m-%Y"]
    )

    class Meta:
        model = PaddyPurchase
        fields = [
            "ref_no",
            "token_no",
            "agent_name",
            "trip_no",
            "date",
            "vehicle_no",
            "bora",
            "katta",
            "plastic",
            "farmer_name",
            "farmer_address",
            "farm_mob",
            "gross_weight",
            "tier_weight",
            "net_weight",
            "bora_weight",
            "suddh_weight",
            "loading",
            "unloading",
            "unloading_point",
            "dharamkanta_man",
            "rate",
            "bardana",
            "gross_total",
            "deduction",
            "kanta",
            "hemali",
            "our_vehicle_rent",
            "agent_commission",
            "other_amt",
            "other_remarks",
            "advance",
            "net_total",
        ]
        # define a custom widget to your net_weight field
        widgets = {
            'net_weight': calculation.FormulaInput('gross_weight-tier_weight')
        }

обязательно включите {{ form.media }} в ваш шаблон.

Вернуться на верх