0

如何使用 JQuery 向 Django 应用程序提交表单、上传文件,以便捕获“成功”处理程序?

我可以使用常规表单提交上传我的 Django 应用程序的文件,但是在 POST 完成后(自然)我被重定向到一个新文件。

用于生成页面的 Djangoviews.py片段是:

def adminImportView(request):
    """
    """
    if request.method == 'POST':
        form = UploadFileForm(request.POST, request.FILES)
        if form.is_valid():
            handle_file(request.FILES['file'])
            return HttpResponseRedirect(reverse('lobbyVisitorLog.view.adminView'))
    else:
        form = UploadFileForm()

    return render(request, 'utils/importDatabase.html', {'form': form});

其中,当没有提交表单时,会生成一个表单块:

<form id="dbImportForm" action="/visitorLog/admin/import/" enctype="multipart/form-data" method="post">
  {% csrf_token %}
  <div class="row">
    <div class="span7">
      <span class="btn btn-success fileinput-button">
        <i class="icon-plus"></i>
        <span>Browse...</span>
        {{ form.file }}
      </span>

      <button type="submit" class="btn btn-primary start" id="buttonImport">
        <i class="icon-upload"></i>
        <span>Start Import</span>
      </button>
    </div>
  </div>
</form>

但是,我会避免在该过程完成后加载新页面。如果我将其更改button为一个简单的链接并使用 JQuery 将其连接起来,我的表单验证将失败。我对 Javascript 块的最新尝试是:

$('#buttonImport').click(function()
{
  if ($('#id_file').val() == '')
  {
    alert("empty file, can't submit!");
    return false;
  }

  $.post(
    '/visitorLog/admin/import/',
    $('#dbImportForm').serialize(),
    function(data)
    {
      alert("all done!");
    },
    "json"
  );
})

如何调整我的 JQuery POST 调用以正确验证服务器端的表单?

4

1 回答 1

0

使用jQuery 表单插件

它支持 AJAX 文件上传。

没有表单插件的另一个解决方案是如何在 jQuery 中发送带有 Ajax 请求的 FormData 对象?但在浏览器中的支持有限。

于 2013-04-22T15:53:20.183 回答