2013年5月10日金曜日

w2ui ver1.2のローカライズ その2

次はカレンダー。公式サンプルを元に日本語化してみました。

サンプルから該当箇所抜粋

<div id="form">
    <div class="w2ui-page page-0">
        <div class="w2ui-label">Date:</div>
        <div class="w2ui-field">
            <input name="field_date" size="16" type="text" />
        </div>
    </div>
</div>

1. まず、カレンダーの月・曜日を日本語化する為のjson (ja-JP.json)を用意

{
    "shortdays"  : ["月", "火", "水", "木", "金", "土", "日"],
    "fullmonths" : ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"]
}

2. ja-JP.jsonを"/json_path/locale"に配置する


3. カレンダーフィールド用のオプションを下記の様に設定する

$('#form').w2form({ 
    name   : 'form',
    fields : [{
        name: 'field_date', type: 'date', options: {
            format  : 'yyyy/mm/dd', // 日付書式
            start   : '2013/05/10', // 選択可能範囲(開始日)
            end     : ''            // 選択可能範囲(終了日)
        }
    }]
});


4. w2utils.localeでjsonをロードする

var file = {
    lang: 'ja-JP',
    path: '/json_path'
};

w2utils.locale(file);

ローカライズ前後の違いはコチラ



 本来であれば、日曜を左端に持ってきたいところですが、何らかの形でw2fieldのcalendar_monthを差し替えなければならないのが面倒です。っていうか、できればやりたくない。外部からの設定だけでできないですかねー...

0 件のコメント:

コメントを投稿