2014年2月5日

jQueryで二重送信を防止する

mawatari 日記 JavaScript, jQuery 0 Comments

jQueryを使った二重送信防止のサンプルをメモしておきます。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<title>jQueryを使った二重送信防止のサンプル</title>
</head>
<body>

<form action="">
	<input type="submit"/>
</form>

<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
	$('form').on('submit', function () {
		$(this).find('input:submit').attr('disabled', 'disabled').val('送信中...');
	});
</script>
</body>
</html>

<?php
sleep(3);

<!DOCTYPE html>

<head>

<title>jQueryを使った二重送信防止のサンプル</title>

</head>

<body>

</form>

$('form').on('submit', function () {

$(this).find('input:submit').attr('disabled', 'disabled').val('送信中...');

});

</script>

</body>

</html>

<?php

sleep(3);

上記のソースコードを form.phpとでも名前を付けて保存をし、実行してみてください。送信ボタンが変化することを確認できると思います。
22行目以降のPHPでのsleep処理は、ボタンが押せなくなったこと、またボタンの文言が変化したことを確認する為に入れているものなので、実際には必要ありません。

上記の例では、汎用性を高めるため、エレメントセレクタを使用しています。パフォーマンスを求める必要があるのであれば、IDセレクタを用いた方が良いでしょう。
また、あくまでJavaScriptでの処理なので、必ず二重送信を防止できるわけではないということも、留意しておいてください。

以上です。

2014年1月31日

ファイルアップロードを画像のみに制限する

mawatari 日記 HTML 0 Comments

ファイルアップロードを画像のみに制限する方法をメモしておきます。
簡易的ではありますが、 accept属性を指定することで実現できます。

<input type="file" accept="image/*">

1	<input type="file" accept="image/*">

こうすることで、対応ブラウザであれば、ファイル選択ウィンドウで、画像ファイル以外はグレーアウトします。たくさんのファイルが並んでいる場合、画像ファイルのみが目立つようになるので、ユーザにも優しいというメリットも生まれます。
ただし、環境によっては、指定したもの以外も選択できるので、厳密に管理したい場合は、サーバサイドでチェックが必要です。

以上です。

2013年12月25日

PHPのarray()を[]に置換する方法

mawatari 日記 NetBeans, PHP, PhpStorm 0 Comments

PHP5.4以降では、 array()を [](short array syntax)短縮構文で書くことができるようになりました。コードの中に存在している array()を []に置換する方法をメモしておきます。
PHP5.4に移行していく中で起こりうる array()と []が混在してて気持ち悪い！という状況等を解消するのに一役買ってくれることでしょう。
ちなみに []記号は、角括弧やブラケット (bracket)等と呼ばれます。

環境

以下の環境で確認をしました。
当然ながら、PHP5.4以降がインストールされている必要があります。

ソフトウェア	バージョン
PHP	5.4.23

PHPのarray()を[]に置換する方法

GitHubにコンバータが公開されています。 convert.phpを取得し、任意の場所に設置してください。
PHP 5.4 Short Array Syntax Converter – GitHub

コマンドの書式は以下の通りです。

# ファイル単位での実行
php convert.php [-w] <file>

# ディレクトリ単位での実行
find <directory> -name "*.php" -exec php "convert.php" -w "{}" \;

# ファイル単位での実行

php convert.php [-w] <file>

# ディレクトリ単位での実行

find <directory> -name "*.php" -exec php "convert.php" -w "{}" \;

以下のようなディレクトリ構成になっていると仮定し、実例を示します。

/convert.php
/app
  /Controller
    /BarController.php
    /BazController.php
    /FooController.php
...

/convert.php

/app

/Controller

/BarController.php

/BazController.php

/FooController.php

...

置換する方法は以下の通りです。

# 実行結果を保存せずにSTDOUTに出力
php convert.php app/Controller/FooController.php

# 実行結果を対象ファイルに上書き保存
php convert.php -w app/Controller/FooController.php

# Controller以下の全てのPHPファイルを対象に実行し、上書き保存
find app/Controller/ -name "*.php" -exec php "convert.php" -w "{}" \;

# スクリプトを信用できない人向けに変換後の構文チェックもできる
find app/Controller/ -name "*.php" -exec php -l "{}" \; | grep "error:"

# 実行結果を保存せずにSTDOUTに出力

php convert.php app/Controller/FooController.php

# 実行結果を対象ファイルに上書き保存

php convert.php -w app/Controller/FooController.php

# Controller以下の全てのPHPファイルを対象に実行し、上書き保存

find app/Controller/ -name "*.php" -exec php "convert.php" -w "{}" \;

# スクリプトを信用できない人向けに変換後の構文チェックもできる

find app/Controller/ -name "*.php" -exec php -l "{}" \; | grep "error:"

.php以外のファイルも対象にすることも可能です。例えば、CakePHPのViewの .ctpファイルも期待通りに処理してくれます。
以上です。

2013年12月6日

CLIで大文字小文字に関係なく補完する

mawatari 日記 Bash, Tips 1 Comment

コマンドラインインターフェースで、大文字小文字に関係なく補完する方法をメモしておきます。

環境

環境は以下の通りです。MacOSやCentOSで確認しました。それぞれBashを使っています。

ソフトウェア	バージョン
MacOS	10.8.5
CentOS	6.4

CLIで大文字小文字に関係なく補完する設定

手順は以下の通りです。

cd ~/
touch ~/.inputrc
echo set completion-ignore-case on >> ~/.inputrc

cd ~/

touch ~/.inputrc

echo set completion-ignore-case on >> ~/.inputrc

要は、 inputrcに completion-ignore-case onが記述されていれば良いということですので、 /etc/inputrcに書いてもOKです。
以上です。

2013年12月4日

Macにbash-completionをインストールし補完を活用する

mawatari 日記 Bash, Homebrew, Mac, Tips 2 Comments

Macにbash-completionを導入し、補完を活用する方法をメモしておきます。
Homebrewを使ってインストールを行うので、事前にHomebrewをインストールしておく必要があります。以下の記事を参考にしてください。
MacにHomebrewをインストールする

環境

環境は以下の通りです。

ソフトウェア	バージョン
MacOS	10.8.5
Homebrew	0.9.5

Macにbash-completionをインストールする

Macにbash-completionをインストールします。手順は以下の通りです。

brew install bash-completion

1	brew install bash-completion

これでbash-completionのインストールは完了です。
インストール時のメッセージにもある通り、 .bash_profileに以下を追記すれば、補完が有効になります。

if [ -f $(brew --prefix)/etc/bash_completion ]; then
  . $(brew --prefix)/etc/bash_completion
fi

if [ -f $(brew --prefix)/etc/bash_completion ]; then

. $(brew --prefix)/etc/bash_completion

補完対象を追加する場合は、 /usr/local/etc/bash_completion.d/以下に、Bashファイルを設置すればOKです。
以上です。

«‹ 5 6 7 8 ›»