jquery - Google App Engine での Ajax フォームの構築

Question

フォームがあり、送信ボタンをクリックすると、サーバーと通信し、サーバーから何かを取得して同じページに表示したいと考えています。すべてを AJAX 方式で行う必要があります。Google App Engine でそれを行うには? できればJQueryでやりたいです。

編集: code.google.com/appengine/articles/rpc.htmlの例はフォームでは機能しません。

---

編集: rpc プロシージャは form では機能しません。

Answer 1

jquery Formプラグインを使用して、ajaxを使用してフォームを送信できます。非常にうまく機能します。

$('#myFormId').submit(function() {
    // submit the form
    $(this).ajaxSubmit();
    return false;
});

Answer 2

Firebug に追加すると、コンソールに ajax 呼び出しがポップアップ表示されるはずです。そのアドレスを開いたときに例外が発生する場合は、Python コードに問題があります。URL を正しくマッピングしていない可能性がありますか?

Answer 3

私は以前にjQueryでこのようなことをしました（それが「最良の」方法であるかどうかはわかりませんが、うまくいきます）：

function jsonhandler(data) {
   // do stuff with the JSON data here
}

var doajax = function () {
    arr = Object();
    $("#form_id").children("input,select").each(function() { arr[this.name] = this.value;});
    $.getJSON("<page to call with AJAX>", arr, function (data) { jsonhandler(data);});
}

$(document).ready(function () {
    $("#submit_button_id").replaceWith("<input id=\"sub\" name=\"sub\" type=\"button\" value=\"Submit\">");
    $("#sub").click(doajax);
}

$.getJSON は、目的のjQuery AJAX 関数に置き換えることができます。呼び出しているページの出力を表示したいだけなら、おそらく $.get が最善の策です。フォームに input と select 以外の入力タイプがある場合は、それらも children 関数に追加する必要があります。