2018-01-01から1年間の記事一覧

Datatables小ネタ集

Datatablesとは DataTables | Table plug-in for jQuery 行選択イベント 行選択時のイベントを捕まえる方法は二通りある。 select/deselectイベント ユーザーによる選択でもコードによる選択でも発火する。 タイミングは選択された「後」。 singleモードだと…

AJAX処理を順番に実行する

やりたいこと 複数のAJAX処理を一つずつ順番に、前の処理が終わるのを待って実行したい。 環境 jQuery 1.8 以降 やり方 jQueryのDeferredオブジェクトを利用してAJAX実行Queueを作成する。途中でエラーが発生した際にそのまま続行するQueueと以降の処理をキ…

ファイルダウンロード用のViewを自作する

Springでファイルダウンロードを実装する方法はいろいろあるが、今回はViewを自作する方向でやってみたい。 利点 レスポンスヘッダーの設定など、冗長になりがちなコードをコントローラーに書かなくて済む。 戻り値の型を文字列で統一できるので、条件によっ…

動的に追加される要素にイベントハンドラーをアタッチしたい

例えばテーブルの各行にクリックイベントをアタッチしたいとき、それがAJAXで非同期にデータをロードするテーブルならばロードのたびにアタッチし直さなければならないし、ユーザーが自由に行追加できるテーブルならばその都度追加行にアタッチしなければな…

Springで自作のエラーページを表示する

ここではSpring組み込みのWEBサーバーを使用するのではなく別のサーバーにデプロイするケースを考える。つまりEmbeddedServletContainerCustomizerが使えないケース。 環境 Spring Boot 1.4 + Thymeleaf やり方 以下は404 Not FoundでnotFound.html、401 For…

フォームの二重投稿を防止する

submitと同時にボタンをdisabledにする。 やり方 ページロードイベント中に以下を追加。 $('form').on('submit', function() { // 全てのボタンをdisabledにする $('button, input[type="submit"]').prop("disabled", true); }).on('click', '[type=submit]'…

ファイルダウンロードの終了をブラウザ側で検知したい

やり方 Cookieを使う。 $('form').on('submit', function() { const currentToken = getCookie("DOWNLOAD_TOKEN"); const downloadTimer = window.setInterval(function () { const newToken = getCookie("DOWNLOAD_TOKEN"); if (newToken != currentToken) …

WebフォームでEnterキーを押したときにフォーカスを移動させたい

いやTabキー押せよ、って思うけど仕方ない。 やり方 $('form').on('keydown', 'input, button, select', function(e) { if (e.keyCode == 13) { if ($(this).attr("type") == 'submit') return; var form = $(this).closest('form'); var focusable = form.f…

ブラウザの戻るボタンを禁止したい

本当はそんなことしたくない。 なお、あくまで戻るボタンを封じるだけなので履歴を使うと戻れる。 環境 HTML5に対応したブラウザ やり方 ページロードイベント中に以下のコードを追加。 history.pushState(null, null); $(window).on('popstate', function(e…

Spring Securityで独自の認証を実装する

環境 やりたいこと 用意するクラス ユーザー情報クラス AuthenticationFilter AuthenticationProvider 設定 あとがき 環境 Spring Boot 1.4 やりたいこと ログイン画面で所属部署コード、ユーザーID、パスワードを入力してログイン。認証はDBやAPI等、何かし…