jquery
はじめに bootstrapのモーダル使っててモーダルサイズが画面からはみ出るのが嫌だったので修正したときのメモ。 今回やったのは以下の2パターン ・テキストベースのモーダル ・画像を大きく表示するための画像ベースのモーダル テキストベースのモーダル 修…
はじめに 以前に自分が作ったシステムで主にjqueryを使って作ったものがありました。 基本的には困ることはなかったのですが、特定のページだけ複雑になってきていじるのが嫌になってきました。。。作りたい画面のイメージとしてはこんなかんじメイン画面 モ…
はじめに 今回やりたかったのは画像を選択するようなプルダウン。 検索してみたら、bootstrap-select.jsというのがありました。http://thdoan.github.io/bootstrap-select/ こちらからDL 実装 使い方は簡単でjsを読み込んで以下みたいな感じで使える。 boots…
はじめに 以前につくったサービスの改修で必要になった。どこかのブログに書いてあったのをコピーして動いたのでそれでよしとしていたのだが、今回はそれが1ページに複数必要になって問題が発生したので作り直してクラスにしてみた DOM操作にjQuery使ってい…
たまにやろうとするとパッと出てこずに何度も調べている気がするのでメモしておく 一覧のクリックする行によってモーダルの中身を変えたい時などにも使える <button id="onModal" class="btn btn-default">Open</button> <div id="myModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> </div></div></div>
はじめに 今回初めてadminLTEというboostrap製の管理画面用のデザインテンプレートを使ったのですがかなりイイです。 情けない事に今までcssは1ミリもいじりたくないってタイプだったのですが、それなりの見た目の画面が用意できましたで、その中でchartjsと…
はじめに タイトルのとおりですが知っていればかなり便利でした。 次回もサクっと使えるようにメモしておきます 使うもの ・jQuery ・Bootstrap ・bootstrap-daterangepicker ・moment.js 準備 jqueryとbootstrapはCDNを使用 bootstrap-daterangepickerはこ…
はじめに jqueryでvalidationを実装する方法 - とりあえずphpとか こちらで実装したvalidationにさらにNGワードのチェックをリアルタイムにつける必要があったので、この処理にさらに実装方法を追加追加する機能 ・NGワードのリストはデータベースにもつ ・N…
はじめに jqueryでのvalidation実装。 ありがちな機能ではありますが、久々に実装する機会があったのでメモ。 jqueryのプラグインとか探せば色々ありますが、過去にかゆいところに手が届かない的な事もあったので今回は全て自前で実装してみました。機能とし…
やりたかったこと 1. ユーザが入力フォームからデータを入力して登録ボタンをおす 2. 登録完了ページを表示 3. ブラウザの戻るボタン（iPhone等ならスワイプで戻る） 4. 1で入力した内容が残ってしまう、、、 上記の4.で入力した内容をすべて空にしたいとい…
やりたいこと サイトにアクセスしたユーザの端末のFLASHのインストール状況を取得したかった 実装 こちらに実装方法がありました。 swfobjectを使用した簡単Flash Playerバージョン取得 | iwb.jpSWFObjectというプラグインで本来(?)HTMLにFLASHを埋め込む用…
はじめに このプラグインはとても有名なようで、けっこう使われているようです。 今回デザイナーさんからもらったページでも使われていてヌルヌルとメニューがスライドしていいかんじでした。レシポンシブにも対応しているようなのでスマホでも使用可能ですh…
画像選択して選択中の画像をフォームで送信できるようなプラグインを探していたらいい感じのがあったので紹介です。 公式サイトはこちらで「Image Picker」というプラグインです。こちらはjqueryのプラグインで、angular.jsで作ってるサイトで使おうとしたら…
やりたかったこと 画像の一覧ページの表示が非常に重いとのことで見てみると1ページに表示してるコンテンツの画像は10件。 けど1ファイルのサイズがどれも3Mくらいあってそのまま表示してるだけなので、それは重くなるなぁと、、、対応案としては 案1. jquer…
まずやりたかったこと ログインフォームとボタンだけ設置してログインボタン押下でajax通信で外部のサーバへ認証処理を行う。 サーバ側での認証がokだったらphpのセッション変数に保存。 ログイン成功後はhtmlからajax通信でphpで作成したapiにアクセスして…
ファイル選択時に選択した画像をページに表示 まずはココから、canvasResize.jsをダウンロード その中に以下のファイルがあるのでこれらを使います。またjqueryも使います binaryajax.js exif.js canvasResize.js <script src="jquery.js"></script> <script src="binaryajax.js"></script> <script src="exif.js"></script> <script src="canvasResize.js"></script>
まずはjquery.autopager.jsをダウンロード こちらにありました PHP部分の実装 mvc的にはこういうのはviewに書くのがいいのかもしれませんが、僕は迷わずcontrollerに書いてます。 //全データ数を取得 $all_num = 何らかの処理//select count(*) from *** whe…
わかりやすい、使いやすいのでメモ http://qiita.com/mocha/items/c6a626416daaa04d0668 ↑このページのものをそのままです var top = top || {}; // ancestor namespace top.second = top.second || {}; // ancestor namespace (function (third) { // names…
といいつつ、カスタマイズではなくてjqueryのプラグインの紹介ですjquery.remodal.jsというプラグインがあるのですがコレを使います ここからダウンロードsrc/ の中の以下の2ファイルを使用します jquery.remodal.css jquery.remodal.jsで，使い方は以下のよ…
複数要素に対して同じ様なことを記述していたので、こうすれば少しはコードが短くなるかもしれません、、、 <select id="elm1" name="elm1"> <option value="1">選択1</option> <option value="2" selected>選択2</option> </select> <select id="elm2" name="elm2"> <option value="1" selected>選択1</option> <option value="2">選択2</option> </select> <script> $("#elm1,#elm2")…
これでformをsubmitするさいに任意の値を追加して送信することができました <form id="form"> <input type="submit" value="送信"/> </form> <script> $("#form").submit(function() { $("<input>",{ type:"hidden", name:"input_name", value:"input_value" }).appendTo("#form"); }); </script>リンク集へ
triggerメソッドの第2引数に配列で渡すことで実装できました <form id="form"> <input type="submit" value="送信"/> </form> <script> var data = ["aaa","bbb"]; $("#form").trigger("submit",data); $("#form").submit(function(event,v1,v2) { console.log(v1);//aaa console.log(v2);//bbb }); </script>リンク集へ
