AIR DATEPICKER日本語化

AIR DATEPICKERはjQueryのプラグインで軽量かつきれいな日付選択用のDatePickerが表示できるプラグインです。

・配布サイト：http://t1m0n.name/air-datepicker/docs/

まぁ、この手のものは選択肢は多いのですがそのまま使ってもみためが良いので使いやすいですね。

さて、AIR DATEPICKERは多言語対応していて、各言語用の設定ファイルは外部ファイルになっていますが、残念ながら日本語がありません。
でも簡単に対応出来ますのでご安心を。

■１．日本語用の設定ファイルを作成する

といっても、イチから作成する必要はありません。
ダウンロードするとついてくる「datepicker.●●.js」というものが言語設定ファイルなので、どれかを適当にコピーして、「datepicker.jp.js」という名前にしましょう。
（名前は何でも良いですけど、日本はjpという気がする）

■２．中身を書き換える

テキストエディタで開き、下記の様に書き換えていきます。

●1行目
$.fn.datepicker.language['en']
→$.fn.datepicker.language['jp']

これは必須ではありませんがやっとかないと分かりにくいので。
これで、「jp」というキーワードで日本語モードにできるようになります。

●2～8行目
曜日、月、「今日」「クリア」といった言葉をどう表記するかの設定です。
曜日の設定は文字の長さの違いで３つありますが、日本語の場合は「日月火水木金土」でもともと短いので全部同じで良いように思います。
月の表示は迷いますけど、場合によっては英語でもいいかなと思うし、「1月」～「12月」などと変えても良いでしょう。

●9～10行目
年月日と時間の表示形式です。
日本では「yyyy/mm/dd」が一般的ですね。

■３．言語設定ファイルを読み込む

２で作成したファイルを読み込んでください。

■４．日本語を有効にして呼び出す

AIR DATEPICKERを使いたいときは、使いたい場所に「datepicker-here」というClassを記述します。（基本的な設定方法は本家サイトを参照）
同じ場所に「data-language="jp"」という属性を追加すると、日本語モードで呼び出されます。

【まとめ】

ということで、日本語対応も簡単ですね。
言語設定が別ファイルになっているのは扱いやすくていい感じです。