0

我正在使用 Django 和 Google 的 Closure javascript 库，我想通过 AJAX 进行一些表单处理。

目前，我在页面上有一个按钮，上面写着“添加分数”。当您单击它时，它会触发 goog.net.Xhrio 请求以加载另一个带有表单的 URL，并通过调用loadForm().

loadForm = function(formId) {
  var form = goog.dom.getElement(formId);
  goog.style.setElementShown(goog.dom.getElement('popup-box'), true);
  goog.net.XhrIo.send(form.action, displayForm, form.method);
}

displayForm = function(e) {
  goog.dom.getElement('popup-box').innerHTML = e.target.getResponseText();
}

加载的 Django 表单是一个非常基本的模型表单，具有一个简单的“分数”属性，可以根据数字范围进行验证。这是我必须处理表单提交的代码：

def Score(request):
  obj = ScoreModel.get(pk=request.POST['obj_id'])
  form = ScoreForm(request.POST, instance=obj)

  if form.is_valid():
    form.save()
    messages.success(request, 'Score saved!')
    return shortcuts.redirect('index')
  else:
    context_vars = {'score': score, 'form': quarter_form}
    shortcuts.render_to_response(
        'score_form.html', context_vars,
        context_instance=context.RequestContext(request))

如果输入分数本身的表单只是显示在页面上，这一切都可以正常工作，但是因为它是一个 AJAX 弹出窗口，所以它不能正常工作。如果我只是做一个简单的表单提交（通过 HTML 提交按钮），如果数据有效，它就可以正常工作。但是，如果数据无效，它不会在弹出窗口中显示有错误的表单，它只会在主浏览器窗口中而不是在弹出。

相反，如果我通过loadForm()上面的 JS 方法提交表单，如果表单无效（并在弹出框中显示无效表单），它工作得很好，但如果表单有效则不起作用（因为主索引页面最终显示在我的弹出窗口的 innerHTML 中）。

我似乎无法弄清楚如何让代码在这两种情况下都能正常工作。那么，我怎样才能吃到我的蛋糕呢？:)

这是一个奇怪的问题，所以如果我解释得不够好，请告诉我，我会尽力澄清。提前致谢。

4

1 回答 1

0

我让它工作。基本技巧是，如果表单提交成功，我不是返回重定向，而是返回一个带有重定向状态代码和重定向到的 URL 的基本响应对象。然后我修改了我displayForm()以查找它并在找到它时重定向。

这是Score()函数的修改代码：

if form.is_valid():
  form.save()
  messages.success(request, 'Score saved!')
  redirect = shortcuts.redirect('index')
  return http.HttpResponse(content=redirect['Location'],
                           status=redirect.status_code)

和修改displayForm()：

var displayForm = function(e) {
  var responseText = e.target.getResponseText();

  if (e.target.getStatus() == 302) {
    // If this was a redirect form submission, the response text will be the URL
    // to redirect to.
    window.location.href = responseText;
  } else {
    // Regular form submission.  Show the response text.
    goog.dom.getElement('popup-box').innerHTML = responseText;
  }
};
于 2013-07-03T22:05:35.343 回答