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送信ボタンを介して)単純なフォーム送信を行うだけで、データが有効であれば問題なく動作します。ただし、データが有効でない場合は、エラーのあるフォームをポップアップに表示する代わりに、ポップアップに表示されるはずだったテキスト (エラーのあるフォーム) のみを、メインのブラウザー ウィンドウではなく、メインのブラウザー ウィンドウに読み込みます。現れる。

逆に、上記の JS メソッドを使用してフォームを送信するとloadForm()、フォームが無効な場合 (およびポップアップ ボックスに無効なフォームが表示される場合) は完全に正常に機能しますが、フォームが有効な場合は機能しません (メイン インデックス ページが私のポップアップのinnerHTMLに表示されることになります)。

両方のシナリオでコードを機能させる方法がわかりません。では、どうすればケーキを手に入れて食べることができますか? :)

これは一種の奇妙な問題です。十分に説明していない場合はお知らせください。明確にしようと思います。前もって感謝します。

4

1 に答える 1