API виджетов формы на стороне клиента

Для динамического создания полей формы в интерфейсе редактирования StreamField, все виджеты Django форм, используемые в блоках StreamField, должны иметь соответствующую реализацию на JavaScript, определяющую, как виджет отображается на стороне клиента, как заполняется данными, и как извлекаются данные из этого поля. Wagtail предоставляет эту реализацию для виджетов, наследующих от django.forms.widgets.Input, django.forms.Textarea, django.forms.Select и django.forms.RadioSelect. Для других типов виджетов или таких, которые требуют пользовательского поведения на стороне клиента, вам необходимо предоставить собственную реализацию.

Библиотека telepath используется для настройки соответствия между классами виджетов Python и их соответствующими реализациями на JavaScript. Для создания соответствия определите подкласс wagtail.core.widget_adapters.WidgetAdapter и зарегистрируйте его с помощью wagtail.core.telepath.register.

from wagtail.core.telepath import register
from wagtail.core.widget_adapters import WidgetAdapter

class FancyInputAdapter(WidgetAdapter):
    # Identifier matching the one registered on the client side
    js_constructor = 'myapp.widgets.FancyInput'

    # Arguments passed to the client-side object
    def js_args(self, widget):
        return [
            # Arguments typically include the widget's HTML representation
            # and label ID rendered with __NAME__ and __ID__ placeholders,
            # for use in the client-side render() method
            widget.render('__NAME__', None, attrs={'id': '__ID__'}),
            widget.id_for_label('__ID__'),
            widget.extra_options,
        ]

    class Media:
        # JS / CSS includes required in addition to the widget's own media;
        # generally this will include the client-side adapter definition
        js = ['myapp/js/fancy-input-adapter.js']


register(FancyInputAdapter(), FancyInput)

Объект JavaScript, связанный с экземпляром виджета, должен предоставлять единственный метод:

Состояние виджета часто совпадает со значением поля формы, но может содержать дополнительные данные, помимо тех, которые обрабатываются при отправке формы. Например, виджет выбора страницы состоит из скрытого поля формы, содержащего идентификатор страницы, и только для чтения метки, отображающей заголовок страницы: в этом случае, сам идентификатор страницы не предоставляет достаточной информации для отображения виджета, и поэтому состояние определяется как словарь с id и title элементами.

Значение, возвращаемое render — это объект «связанного виджета», позволяющий получить доступ к данным этого экземпляра виджета. Этот объект должен реализовывать следующие атрибуты и методы: