如何以 django 形式处理复杂的图形 UI 元素？答案

【问题标题】：How do I process a complex graphical UI element in a django form?如何以 django 形式处理复杂的图形 UI 元素？
【发布时间】：2010-10-13 20:45:00
【问题描述】：

我有一些与标准 django 表单输入字段一起出现的复杂 GUI 元素（例如可以突出显示多天的自定义日历）。我想处理来自这些复杂表单的数据 I/O 以及 Django 表单。

以前我会在保存或呈现 Django 表单后使用 AJAX 请求来处理我的 HTML 表单上的这些自定义 GUI 元素，但这会导致大量问题和自定义 AJAX 编码。在 Django 表单中处理复杂交互小部件的好方法是什么？

【问题讨论】：

标签： ajax django django-forms

【解决方案1】：

不确定我是否完全理解，但您可以通过 javascript 将 UI 的值保存到表单上的隐藏元素中。这可以在他们选择 UI 中的值或提交表单时完成。伪代码假设 JQuery 在发送提交数据之前使用 submit() 保存：

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

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

这显然需要 JS，但使用你的 UI 元素也是如此。

【讨论】：

【解决方案2】：

您的问题非常模糊，所以我建议您阅读writing a custom field 上的 Django 文档，希望这能帮助您入门。您可能还想研究编写自定义小部件。不幸的是，文档有点缺乏，但谷歌搜索会找到几篇有用的博客文章，包括this one。

【讨论】：

【解决方案3】：

根据您将 Django Form 子类输出到 HTML 页面的方式，您有三个选项。

第一个根本不涉及Form。任何 html 表单输入都将在 request.POST 中结束，因此您可以在那里访问它们。没错，它们不会绑定到您的 Form 子类，因此您必须使用自定义表单构造函数手动注入该值，或者在使用 request.POST 实例化它之后在您的 Form 对象上设置一些属性。这可能是最不理想的选择，但我会提到它，以防您的用例真的不支持其他任何东西。

如果您在 HTML 中手动输出表单字段（即：使用 {{ myform.field }} 而不仅仅是 {{ myform }}，则第二个选项是一个选项。在这种情况下，创建一个隐藏变量来包含您的日历 GUI 工具的值（很有可能，您的 GUI 工具已经提供/需要一个）。使用正确的名称和 ID 将此隐藏字段添加到 Form 子类本身，确保它具有隐藏的 django 表单小部件。如有必要，请按照 Rob 的建议使用 javascript填充隐藏字段。当表单发布时，它将正常绑定到您的表单子类，因为这一次，您的表单子类上有一个具有该名称的字段。clean() 的机制将正常工作。

第三个也是最好的选择是编写一个自定义的 django 字段；安德鲁的帖子有链接。 Django 字段能够指定 js 和 css 要求，因此您可以为使用日历小部件的任何页面自动封装这些依赖项。

【讨论】：