我正在使用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中)。
我似乎無法弄清楚如何讓代碼在這兩種情況下工作。那麼,我怎樣才能擁有我的蛋糕並將它吃掉呢? :)
這是一個奇怪的問題,所以如果我沒有解釋得不夠好,讓我知道,我會盡力澄清。提前致謝。
爲什麼你需要彈出的形式? – silviud
這就是UI的設置。所有的表格都會在內容上彈出,只是這個表單我們實際上需要第一次驗證。 – Chad
好的 - 當你做一個帖子到服務器django將運行驗證,然後顯示錯誤的表單(如果驗證失敗),我不知道如何將它做到一個彈出窗口,因爲你需要呈現表單模板再次。一種不同的方式來實現AjaxMixin - 請參閱https://docs.djangoproject.com/en/dev/topics/class-based-views/generic-editing/#ajax-example。 – silviud