ハマログ

株式会社イーツー・インフォの社員ブログ

Ajaxで$.postのForm送信にserialize(シリアライズ)を使用する

こんにちは。S.Iです。

先日、試行錯誤したAjaxでPOSTメソッドでForm送信にserialize(シリアライズ)を使用する方法を紹介します。

$.postは$.ajaxの略記です。$.ajax関数で次のように指定した処理と同じ処理を実行します。
引数の説明はこちら

$.post( "test.php", { name: "John", time: "2pm" } );

通常はこんな感じでname=太郎&mail=…のような形式の文字列dataを指定しますがチェックボックスやラジオボタンなんかの値を確実に処理するのは手間です。また保守性の観点でもよろしくありません。

そんなときのserialize(シリアライズ)!!

<script>
    $(document).ready(function() {
        $(".saveMySearch").on('click', function(e) {
            var params = $("#searchForm").serialize();
            $.post("/{{$segment}}/api/job/mysearch/add", params,
                    function(jsonData) {
                        data = JSON.parse(jsonData);
                        if (data && data.result) {
                            var inst = $.remodal.lookup[$('[data-remodal-id=sendmysearch]').data('remodal')];
                            inst.open();
                        } else {
                            var inst = $.remodal.lookup[$('[data-remodal-id=sendmysearcherror]').data('remodal')];
                            inst.open();
                        }
                    });
            return false;
        });
    });
</script>

フォームの内容をテキストに変換する便利な機能です。
$searchForm.serialize()で得られる値をそのまま利用できるので便利ですね+。(ш´ω`*)шワーイ

Ajaxformserialize

  S.I   2014年9月8日


関連記事

Eclipse起動しなくなったので解決しましたの巻

突然Eclipseが起動しなくなりました。 画面に表示されるエラー内容は以下のと…

Laravelのキューイングを実装する

はじめに Laravel5で、とあるサービスの並行して走る複数のジョブをComm…

Laravel Collectionのpluckとlistsについてまとめ(5.2以降はpluck)

Laravelの5系のpluckとlistsについて、混乱したのでまとめておきま…


← 前の投稿

次の投稿 →