Django admin: Как динамически отобразить вычисленное значение из введенных значений на странице формы администрирования Django? - PullRequest
0 голосов
/ 31 марта 2020

У меня есть форма с полями «цена», «налог» и «скидка» (IntegerFields). И тогда появится еще одно поле, доступное только для чтения, под названием «total_price».

, пока мы вводим «price», «discount» и «tax», автоматически должно отображаться значение «total_price». Если мы изменим «скидку» или «цену», то «итоговая цена» также изменится немедленно.

После просмотра окончательной цены мы можем нажать кнопку «Сохранить».

Как этого добиться в Django админ?

1 Ответ

1 голос
/ 31 марта 2020

Для этого вам необходимо добавить пользовательский код Javascript на страницу администратора.

Вот что вы можете сделать:

  1. Добавить поле только для чтения для администратора - будет отображаться «total_price»
  2. Добавить пользовательский скрипт на страницу администратора.
  3. Запись JS скрипт - этот скрипт будет делать «живое обновление» общей стоимости

Ваш администратор может выглядеть следующим образом:

@admin.register(YourModel)
class YourModelAdmin(admin.ModelAdmin):

    # some code here...

    readonly_fields = ('total_price', )

    def total_price(self, obj):
        # return whatever initial value you want
        return obj.price - obj.price*obj.discount

    # This is important - adding custom script to admin page
    @property
    def media(self):
        media = super().media
        media._js.append('js/your-custom-script.js')
        return media

Помните, что js/your-custom-script.js должен быть в вашей папке * stati c files.

ОБНОВЛЕНИЕ: Вместо перезаписывая свойство media, вы можете включить свой JS, используя Meta вложенный класс:

class YourModelAdmin(admin.ModelAdmin):
    ...
    class Media:
        js = (
            'path-to-your-static-script-file.js',
        )

Последний шаг - написать скрипт для обновления значения поля total_price всякий раз, когда какое-либо другое поле изменен.

Пример: если вы хотите изменить total_price при каждом изменении price, ваш скрипт может выглядеть следующим образом:

if (!$) {
    $ = django.jQuery;
}
$(document).ready(function(){
    // Add event listener to "price" input
    $("#id_price").change(function(e){
        // Get entered value
        let price = parseFloat($(this).val());

        // Get discount value from another field 
        let discount = parseFloat($("#id_discount").val())

        // Compute total price in whatever way you want
        let total_price = price - price*discount;

        // Set value in read-only "total_price" field.
        $("div.field-total_price").find("div.readonly").text(total_price);
    });
})

Если вы хотите обновить total_price, когда discount или tax поля изменены, просто добавьте к ним прослушиватели событий.

...