Как мне обработать сложный графический элемент пользовательского интерфейса в форме Django?

Question

У меня есть несколько сложных элементов GUI (например, настраиваемый календарь с большим количеством дней, которые можно выделить), которые отображаются вместе со стандартными полями ввода формы django. Я хочу обработать ввод / вывод данных из этих сложных форм вместе с формами Django.

Раньше я использовал запросы AJAX для обработки этих пользовательских элементов GUI в моей HTML-форме после того, как форма Django была сохранена или визуализирована, но это приводит к множеству проблем и настраиваемому кодированию AJAX. Что такое хороший способ обработки виджетов сложных взаимодействий в форме Django?

Answer 1

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

Answer 2

У вас есть три варианта в зависимости от того, как вы выводите свой подкласс Django Form на HTML-страницу.

Первый вообще не касается формы. Любые входные данные HTML-формы будут в конечном итоге в request.POST, так что вы можете получить к ним доступ там. Правда, они не будут привязаны к вашему подклассу Form, поэтому вам придется вручную ввести значение либо с помощью пользовательского конструктора формы, либо путем установки какого-либо свойства в вашем объекте Form после создания экземпляра его с помощью request.POST. Это, вероятно, наименее желательный вариант, но я упомяну его в случае, если ваш вариант использования действительно не поддерживает ничего другого.

Второй вариант, если вы вручную выводите поля формы в своем HTML (то есть: используете {{ myform.field }} вместо {{ myform }}. В этом случае создайте скрытую переменную, которая будет содержать значение вашего инструмента календаря с графическим интерфейсом ( Скорее всего, ваши инструменты GUI уже предлагают / требуют его.) Добавьте это скрытое поле с правильным именем и идентификатором в сам подкласс Form, убедившись, что у него есть скрытый виджет формы django. При необходимости используйте javascript, как предлагает Роб. Заполните скрытое поле. Когда форма будет опубликована, она будет привязана к вашему подклассу формы как обычно, потому что на этот раз у вас есть поле в подклассе формы с этим именем. Механизм для clean() будет работать как обычно.

Третий и лучший вариант - написать собственное поле django; Эндрю пост имеет ссылку. Поля Django могут указывать требования js и css, поэтому вы можете автоматически инкапсулировать эти зависимости для любой страницы, которая использует виджет календаря.

Answer 3

Не уверен, что я полностью понимаю, но вы можете сохранить значение вашего пользовательского интерфейса в скрытом элементе формы через javascript Это может быть сделано либо при выборе значений в пользовательском интерфейсе, либо при отправке формы. Псевдокод, предполагающий, что JQuery использует submit () для сохранения перед отправкой данных отправки:

$('#myForm').submit(function(){
  // get the value of your UI
  var calendarValue = calendarWidget.getValue()

  // #calendarData is the hidden field
  $('#calendarData').val(calendarValue)
})

Очевидно, что для этого требуется JS, но для этого нужно использовать элемент пользовательского интерфейса.