Slim3でPOST＠jQuery

普段あまり使わないjQuery。忘れないうちにメモ。
GAEのフレームワークSlim3でjQueryのPOST使う時。

今回やったのは大きく2パターンあって、

$.postと$.ajax

違いは、前者は処理結果(success or error)を判別しない。
後者は処理結果を判別する。
処理に失敗した時に挙動を分けたい時は後者を使うといいかも。

下記はURL「/hoge」に対して、パラメータ「id=tarou」を送って、
返ってきたデータを
<div id="res"></div>
に表示させる方法。

$.postの場合

$(function(){
    //IDの存在チェック
    $("#checkId").click(function () {
        $.post("/hoge",{"id":"tarou"},
            function(data,status){
                $("#res").html(data);
            }
                ,"html"
            );
    });
});

…

<div id="res"></div>


$.ajaxの場合

$(function(){
    //IDの存在チェック
    $("#checkId").click(function () {
        $.ajax({
            type: "POST",
            url: "/hoge",
            data: "id=tarou",
            success : function(data,status){
                $("#res").html(data);
            },
            error:function(){alert("エラーです。");},
            dataType:"html"
        });
    });
});

…

<div id="res"></div>


POST先、「/hoge」の処理(Controllerのrunメソッドです。)

@Override
public Navigation run() throws Exception {

    //レスポンスのエンコード
    response.setContentType("text/html; charset=UTF-8");

    //リクエストパラメータをStringとして取得
    String id = asString("id");

    //レスポンスにセット
    String message = id;

    response.getWriter().write(message);
    return null;
}

これでとりあえず何とかなります。
疎通しかやってないので、$.ajaxのerrorが本当に機能してるかは未確認です。

ちなみにIDをinputから取得したい場合は

data: "id=" + $("#id").val()

とすると出来る。