ajax - django表单向导ajax下一步

Question

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

Answer 1

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

就我而言，当我单击某个按钮时，表单的第一步也是通过 ajax 和 get 呈现的。这就是为什么 div 中一开始没有任何形式。 (我正在使用 bootstrap 的模态)。

<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
    });
});

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

我目前很难进行第一步/上一步，如果您弄清楚了，请告诉我如何做。

这就是您要找的东西？