Django/Closure：如何通过AJAX验证AJAX表单？

我正在使用Django和Google的Closure JavaScript库，并且我想通过AJAX做一些表单处理。Django/Closure：如何通过AJAX验证AJAX表单？

目前，我在页面上有一个按钮“添加分数”。当你点击它时，它会触发一个goog.net.Xhrio请求，通过调用loadForm()来加载另一个带有表单的URL，并在弹出框中显示内容。

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中）。

我似乎无法弄清楚如何让代码在这两种情况下工作。那么，我怎样才能拥有我的蛋糕并将它吃掉呢？ :)

这是一个奇怪的问题，所以如果我没有解释得不够好，让我知道，我会尽力澄清。提前致谢。

来源

2013-07-02 Chad

为什么你需要弹出的形式？ – silviud

这就是UI的设置。所有的表格都会在内容上弹出，只是这个表单我们实际上需要第一次验证。 – Chad

好的 - 当你做一个帖子到服务器django将运行验证，然后显示错误的表单（如果验证失败），我不知道如何将它做到一个弹出窗口，因为你需要呈现表单模板再次。一种不同的方式来实现AjaxMixin - 请参阅https://docs.djangoproject.com/en/dev/topics/class-based-views/generic-editing/#ajax-example。 – silviud

我得到它的工作。基本的技巧是，如果表单提交成功，而不是返回一个重定向，我返回一个带有重定向状态代码的基本响应对象和重定向到的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-03 22:05:35 Chad

Django/Closure：如何通过AJAX验证AJAX表单？

回答

相关问题