勉強したことのメモ

webプログラマが勉強したことのメモ。

formでGET送信時に空のパラメータを送信しない方法(cleanQuery)

   

フォームでGET送信する際、通常だと空のパラメータも送信される。結果として「ドメイン/?param1=&param2=&param=3」みたいなURLとなり、見た目的に気になった。何か簡単な対応方法は無いかと探したところ、cleanQueryというjQueryプラグインで実現できる模様。以下に対応方法をメモ。

 

プラグインについて

残念ながら公式サイトは404エラーで表示できず、CDNも見つけられなかったため以下参考サイトのものを利用する。

/*
* jQuery cleanQuery 2013-03-23
* Authored by guimihanui
* Licensed under the MIT License (http://www.opensource.org/licenses/mit-license.php)
*/

(function($) {
    function cleanQuery(query) {
        var arr = [];
        $.each(query.split('&'), function(i, param) {
            if (param.split('=')[1]) { arr.push(param); }
        });
        return arr.join('&');
    }

    $.fn.cleanQuery = function() {
        this.on('submit', function(event) {
            event.preventDefault();

            var query = cleanQuery($(this).serialize());
            location.href = this.action + '?' + query;
        });

        return this;
    };
})(jQuery);

 

使い方

プラグインを読み込んだ上で以下のようにフォームのIDを指定する。

$('#form_id').cleanQuery();

 

参考サイト

https://libproc.com/jquery-cleanquery/

 - jQuery, JavaScript

  関連記事

Lightboxで画像拡大時に閉じるボタンの位置を右上に変更

Lightbox(バージョン2.7.1)で画像拡大時に閉じるボタンの位置を右下か ...

htmlタグが入った内容の文字を丸める

phpである文字列が○文字以上だった際、 省略してお尻に「……」をつけたいという ...

table内のiframeのheightを最大高さにする

tableのtdの中にリンクがあり、クリックすると td内でiframeが開く。 ...

他サイトのRSS情報を画像付きで表示させる

WordPressでAというサイトを作成し、AのRSS情報をBというサイトでアイ ...

javascriptとPHPで正規表現を使う場合

とりあえず使いそうなのは検索と置換。 ■javascript var str = ...

jQueryでコンテンツのスライド

jQueryもしくはJavaScriptでリンクを押すと 右から左にコンテンツを ...

異なる文字コード間でform送信する

formの送り手がUTF-8で受け手がEUC-JP、 なんとかしてjavascr ...

jQueryのCSS変更

jQueryでCSSを触る際、 $("#aaa").css('height',' ...

jQueryのappendとprepend

よく忘れるのでメモ。 ■append(後ろに足す) http://semooh. ...

jQueryでUNIXタイムスタンプの取得

jQueryでUNIXタイムスタンプを取得したい場合、 $.now()だけで取得 ...