django表单向导ajax下一步答案

【问题标题】：django form wizard ajax next stepdjango表单向导ajax下一步
【发布时间】：2013-07-24 07:05:14
【问题描述】：

我正在使用 django 表单向导创建一个 9 步提案表单。一切都很好，直到我想使用 ajax 来加载下一步。我很难在 jquery 中配置 ajax 调用，因为 django 表单没有包含在表单标记中的操作 url。为什么会这样呢？对我来说双赢的情况是为下一步设置一个加载屏幕，如果该步骤中有上传文件过程，则显示上传文件的加载百分比。谢谢！

【问题讨论】：

标签： ajax jquery django-forms django-formwizard

【解决方案1】：

我正在使用此代码，它对我有用。如您所见，我没有在表单中添加任何操作。我在提交表单时使用 jquery 'on' 函数，因为所有表单都在 div#creation 中重新加载和更改。那么 ajax url 必须是显示表单的那个。

在我的例子中，当我点击某个按钮时，表单的第一步也是通过带有 get 的 ajax 呈现的。这就是为什么起初 div 中没有任何形式的原因。（我正在使用引导程序的模态）。

<div id="creation">
    <!-- form to be display through ajax -->
</div>

View 中 FormWizard 类中重新加载的模板如下 html：

template_name = 'creation_form.html'

由 creation_form.html 提供的代码：

<form id="creation-form" action="#" method="post">
    {% csrf_token %}
    <table>
        {{ wizard.management_form }}
        {{ wizard.form }}
    </table>

    {% if wizard.steps.prev %}
        <button name="wizard_goto_step" class="btn btn-primary" aria-  hidden="true"    type="submit" value="{{ wizard.steps.first}}">First</button>
        <button name="wizard_goto_step" class="btn btn-primary" aria-hidden="true" type="submit" value="{{ wizard.steps.prev}}">Previous</button>
    {% endif %}
    <input id="create-submit" class="btn btn-primary" type="submit" value="submit" />
</form>

这是我的 ajax 调用：

$('#creation').on('submit', '#creation-form' , function(e){
    e.preventDefault();
    var fd = new FormData($('#creation-form').get(0));
    $.ajax({
      url: '/create/',
      data: fd,
      type: "POST",
      success: function(data){
            $('#creation').html(data);
          },
      processData: false,
      contentType: false
    });
});

希望这是对您的回答的正确回应。

我目前很难进入第一步/上一步，如果你弄明白了，请告诉我怎么做。

这就是你要找的东西？

【讨论】：

FormData() 类从何而来？顺便说一句，您只需创建一个<button name="wizard_goto_step" type="submit" value="your_wizard_step"></button>，希望它会有所帮助。谢谢！
我在某处读到了 HTML5 格式。这段代码对你有用吗？我还可以让按钮工作，不是吗？

【解决方案2】：

这就是我所做的-

为每个步骤创建单独的模型表单。这有助于轻松进行服务器端验证。
对每个步骤进行 ajax 调用以在服务器端验证表单，成功后呈现下一个表单并隐藏前一个表单。
在提交最后一个表单时，异步 POST 数据以进行持久性和处理，并在最后一步下方异步呈现响应。
还为每个步骤维护了一个进度条。

这就是我使用 django 表单创建异步表单向导的方式。不整洁但有效！ :)

【讨论】：