jQueryMobileを使ったチェックボックスの値をJavaScriptで操作するときの覚え書き
Mobile Safari上でjQueryMobileを使って
<fieldset data-role="controlgroup"> <input type="checkbox" id="chk1" name="chk1" value="" class="custom" /> <label for="chk1">checkbox1</label> <input type="checkbox" id="chk2" name="chk2" value="" class="custom" /> <label for="chk2">checkbox2</label> </fieldset>
のようなhtmlがあるとき、片方のチェックボックスがチェックされたら、もう片方のチェックボックスを未チェック状態にしたいとします。
普通だと、
$("input:checkbox").change(function() { var radio_name = $(this).attr('name'); //どっちかにチェック入れると,どっちかのチェックを外す if( radio_name === "chk1" ) { $('#chk2').attr('checked', false); } else if ( radio_name == "chk2" ) { $('#chk1').attr('checked', false); } });
のようなコードでOKなのですが、jQueryMobileの場合、タッチパネルに最適化するために、input要素の上にlabel要素を重ねた状態にしています。
そのため、上記のようなコードでは、チェックボックスのchecked属性の値は変わっても、見た目が変わりません。
よくよくマニュアル( http://jquerymobile.com/demos/1.0a4.1/#docs/forms/forms-checkboxes.html )を読むと以下のようにrefreshメソッドを呼んであげないといけないことが分かりました。
$("input:checkbox").change(function() { var radio_name = $(this).attr('name'); //どっちかにチェック入れると,どっちかのチェックを外す if( radio_name === "calendar_check" ) { $('#chk2').attr('checked', false).checkboxradio('refresh'); } else if ( radio_name == "map_check" ) { $('#chk1').attr('checked', false).checkboxradio('refresh'); } });
jQueryMobileのrefreshメソッドを眺めてみると、
refresh: function( ){ var input = this.element, label = this.label, icon = label.find( ".ui-icon" ); if ( input[0].checked ) { label.addClass( $.mobile.activeBtnClass ); icon.addClass( this.checkedicon ).removeClass( this.uncheckedicon ); } else { label.removeClass( $.mobile.activeBtnClass ); icon.removeClass( this.checkedicon ).addClass( this.uncheckedicon ); } if( input.is( ":disabled" ) ){ this.disable(); } else { this.enable(); } }
のような感じになっていて、label要素やicon含みでスタイルの変更を行っていました。
なるほど〜。
dotcloudでphpを動かしてみました
twitterでdotcloudというpaasがあることを知り、phpでも使えるということなので
ちょっと試してみました。
まだbeta版ということで、invite codeが必要になります。
自分の場合は申し込んで3日後にinvite codeが送られてきました。
チュートリアル
http://docs.dotcloud.com/tutorials/firststeps/
を見ながらやっていきます。
1. dotcloudコマンドをインストールする
$ sudo easy_install dotcloud
これで、dotcloudに対して自分用のアカウントを作ったり、デプロイするためのコマンドが使えるようになりました。
2. アプリの名前空間を作る
ojimacという名前にします。
$ dotcloud create ojimac
まだdotcloud上にない、ユニークな名前を付ける必要があります。チュートリアルにある"ramen"という名前をそのまま
使ってしまうと、
error: "ramen" already exists.
のようにエラーになります。
3. phpファイルをデプロイする
phpinfoを表示するだけのプログラムhoge.phpを作成します。
デプロイしてみます。
$ dotcloud deploy -t php ojimac.www
うまくいくと、
Created "ojimac.www".
のようなメッセージが返ってきます。
4. アクセスしてみます
デプロイ先はhttp://
ということなので、
http://www.ojimac.dotcloud.com/
にアクセスすると、
うまく表示されました!
5. ファイルのアップロード
<?php echo 'hello! dotcloud world!';
という内容のindex.phpというファイルをdotcloudにアップしたいとします。
単にファイルをアップロードするときには、pushコマンドを使います。3. と同じディレクトリで、
$ dotcloud push ojimac.www .
とすると、dotcloud側にファイルがアップロードされます。
http://www.ojimac.dotcloud.com/
にアクセスすると、index.phpの内容が表示され、
http://www.ojimac.dotcloud.com/hoge.php
にアクセスすると、でphpinfoが表示されることが確認できます。
7. gitとの連携
dotcloud pushするディレクトリに.gitディレクトリがある場合は、git pushしたときのような挙動になるようです。
$ dotcloud push ojimac.www .
とすると、commitした内容がdotcloud側に反映されます。
ひとまず今回はここまでにしました。最初から環境が用意されているのはとても楽ですね!
サービスを動かす際の選択肢のひとつになりそうです。
git add -pしようとすると Can't locate Error.pm in @INC ... と警告が出る
いつも忘れるのでメモ.
gitをインストールしてgit add -p しようとすると、
Can't locate Error.pm in @INC (@INC contains: /usr/lib/perl5/site_perl/5.8.8 /usr/lib64/perl5/site_perl/5.8.8/x86_64-linux-thread-multi /usr/lib/perl5/site_perl /usr/lib64/perl5/vendor_perl/5.8.8/x86_64-linux-thread-multi /usr/lib/perl5/vendor_perl/5.8.8 /usr/lib/perl5/vendor_perl /usr/lib64/perl5/5.8.8/x86_64-linux-thread-multi /usr/lib/perl5/5.8.8 .) at /usr/lib/perl5/vendor_perl/5.8.8/Git.pm line 101.
BEGIN failed--compilation aborted at /usr/lib/perl5/vendor_perl/5.8.8/Git.pm line 101.
Compilation failed in require at /usr/libexec/git-core/git-add--interactive line 7.
BEGIN failed--compilation aborted at /usr/libexec/git-core/git-add--interactive line 7.
と怒られます。これを解決するには、
とperlのモジュールをインストールします.
性能監視ツールmuninのインストールメモ
サーバーの性能を監視するのに何か良いツールがないかと探していたら
munin ( http://munin-monitoring.org/ ) というツールが
お手軽、簡単ということだったので入れてみました。
環境はAmazon EC2 micro instance + Amazon Linux + Apache 2.2.16です。
設定
- /etc/munin/munin.conf を編集
# dbdir /var/lib/munin
# htmldir /var/www/html/munin
# logdir /var/log/munin
# rundir /var/run/muninのコメント部分を外します↓
dbdir /var/lib/munin
htmldir /var/www/html/munin
logdir /var/log/munin
rundir /var/run/munin
- ドキュメントルートとなるディレクトリの所有者をmuninユーザに
sudo chown -R munin:munin /var/www/html/munin
- デフォルトでは /var/www/html/munin/.htaccess にアクセス制限が掛かっているので、外す or すでにあるユーザBasic認証ユーザを設定 or muninユーザでのBasic認証設定をします。今回は実験なのでアクセス制限を外してしまいました。
AuthUserFile /etc/munin/munin-htpasswd
AuthName "Munin"
AuthType Basic
require valid-user
を
#AuthUserFile /etc/munin/munin-htpasswd
#AuthName "Munin"
#AuthType Basic
#require valid-user
のようにコメントアウトします
- /etc/httpd/conf.d/munin.conf を編集します
# http://ホスト名/munin/ でアクセスできるようにします
Alias /munin/ /var/www/html/munin/
起動
sudo /etc/init.d/httpd restart
sudo /etc/init.d/munin-node restart
参考にしたサイト等
rmで消せないファイルを作ってしまったときに消す方法
しれっと久しぶりに更新です。
' というシングルクオーテーションだけのファイルを作ってしまって
rm '
とやっても消せず調べたのでメモ。
結論としては、'は\でエスケープできるので、
rm '\
で解決です。
以下を参考(というか答えそのまま)にさせてもらいました。
スパーク・ラボ株式会社に入社してました!
2010/10/1よりスパーク・ラボ株式会社に入社しました.
前職はいわゆるSIerでエンジニアをしていました.新卒で入社し,約3年半の勤務となりました.
振り返ってみると,新システムの立ち上げにプログラマとして関わり,その後の保守も担当することができ,システムが生まれ,維持されていく過程を経験をさせてもらうことができました.また,お客様はいわゆる大企業だったのですが,自分たちの会社にしては珍しく直請けで契約しており,お客様と直接やりとりをさせてもらうということもできました.
こんな恵まれた環境だったのですが,ひょんな事からインターネットの世界を知る事になります.2008年頃だったと思います.きっかけは,何か技術的な調べものをしていたときだったでしょうか.インターネットのサービスを作っているベンチャーの特集記事が目にとまりました.そこでは,自分たちで考えたウェブサービスを自分たちで開発し,自分たちで運用しています.しかも開発手法も先進的で,朝のミーティングで決まった仕様を夜にはリリースしてしまうのです.これはどんなに小さな案件でも設計書のレビューが必要で,バージョン管理システムのチェックアウトもリーダーに頼む必要があり,チェックインも申請書が必要な前職の現場では不可能なスピード感でした.衝撃を受けました.
と同時にこのベンチャーの感じ,どこか懐かしいな,と考えてみると,大学の研究室での記憶が蘇ってきました.大学の研究室といえばUnix上でemacsを使ってC言語でガリガリシミュレーションのプログラムを書く,というようなアツい環境でした.大学で朝から晩まで研究室に入り浸ってみんなであーでもない,こーでもないと参考資料を眺めたり,プログラムをデバッグしたり.週一回の進捗報告の為にみんなで夜遅くまでレジュメを書いたり.
大学では,4年生になるまでテニスばっかりしていて,プログラムの講義は出来る人のを写させてもらっちゃうようなダメ学生だったので,4年生の1年間がなければ今の自分はないのではないかというような大変だけれども濃い時間を過ごす事ができました.
そんな体験をしてきたからか,恵まれてはいるものの,変化の少ない環境にいることが段々と不安になってきて,技術的な成長が止まってしまうんじゃないか,このままコードを書かないで数年後には管理だけの仕事をしている自分が頭をよぎりました.側にシフトするような状況になるんじゃないか,と考え始めました.PGからSEになってPMになるというキャリアパスはSIerでは一般的だと思いますが,もっとコードを書きたい,技術者として成長したいという思いが強くなっていったのです.
もちろんPG->SE->PMというパス,経験を積んだ技術者は管理側に回ってお客様との折衝やスケジュール管理などを担当するというやり方を否定するわけではありません.請負という仕事の性質上,お客様とのやりとりは必須ですし,業務の知識がないとお客様のやりたいことをシステムに置き換えることはできないとは思います.
どちらが良い,悪いということではなく,両者は別物なんだ,ということだと今は思っています.
成長する為には,ある程度自分を追い込んで全力で走らないといけないなぁと感じました.
転職を考え始めました.でも,業務システムで身につけたスキルでは,Web業界に転身するのは難しそうだなということも実感していました.ただ,Web業界はSIerな世界よりはできること,作ったもので評価してくれるような印象をもっていました.
それから思いを少しずつ行動に移していきました.業務が終わった後,喫茶店に直行し,閉店までねばって本を読んだり,コードを書いたり.しばらくしてIT勉強会カレンダーを見つけ,東京では有志で技術者が勉強会というものを開いている事に気がつきました.勉強会のページを見ていると,皆さん第一線でバリバリやっているような方ばっかりで気後れしていたのですが,「初心者」と名のつく勉強会を見つけました.それがPHP初心者勉強会でした.この勉強会に参加したことで人生が変わったと今振り返って感じます。
この勉強会は講師がいて,机に座って話を聞くようなスタイルではなくて,毎回課題が出され,次回までに完成させてレビューというスタイルでした.当時は隔週で開催されていたので,間に合わせるのがかなり大変だったのですが,なんとか食らいついているうちに,段々とPHP + MySQLなアプリが作れるようになってきたのです.
そして,2009年の夏休みにATND検索( http://ojimac.sakura.ne.jp/atndapi → http://atnd-kensaku.net )のプロトタイプを作成,勉強会メンバーに見せたところ,これ,公開した方がいいんじゃない!?と言っていただき,体裁を整えてリリースしたのでした.単純なアプリではありますが,サービスを形にするという経験は少しではありますが自信もつきましたし,何と言っても自分で考えて自分で作ったサービスを世に出す事がこんなに楽しい事なんだと知ることができました.
今年になってからは,本に載っていたオレオレフレームワークで書き直してリニューアルしたり,iPhoneで見た時用のページを作ったりと少しずつサービスを成長させて行きました.やっと自分で作ったと言えるモノができました.
それからしばらく以前のように悶々とコードを書く日々が続きました.友人とJavaScriptの本の読書会をしたり,フレームワークの勉強をしたり.
そして2010年になり社会人になって4年目に突入しました.技術的にはまだまだなのは自覚していたのですが,タイミング的には今年しかないだろうなと思って情報収集を始めました.
そして偶然にもTwitterのフォロワー経由でスパーク・ラボの社長@junkeyさんのつぶやき( http://twitter.com/#!/junkey/status/12955713541 )がRTされてきて興味を持ってHPを見てみると,「1人でサービスを作れるエンジニア」を理想としていて自分の理想像と重なっていて,ここで自分を追い込んでみようという気持ちになってきました.それから意を決して連絡し,面接→内定を頂きました.
今の自分が居るのもPHP初心者勉強会の主催の@2chdephpさんはじめ勉強会メンバーの方々,大学の恩師などいろいろな方々のおかげだと思っています.本当にありがとうございます.
これから世の中を楽しくするようなサービスを生み出せるように突っ走っていきます!