jQueryのDatepickerプラグインの年表記を和暦に変える

業務用途だと年の表記を和暦にして欲しいって言われることがありますよね。
せっかく便利なjQueryのDatepikerがあるのですから、ちょっといじって和暦に対応させたいと思います。
(ただしjavascriptは得意じゃないので随分まどろっこしい書き方してると思います。
得意な人は適当に書き換えてください)

私のところのui.datepicker-ja.jsはこんな感じです。
[javascript]
jQuery(function($){
$.datepicker.regional[‘ja’] = {clearText: ”, clearStatus: ”,
closeText: ‘閉じる’, closeStatus: ”,
prevText: ‘<前月', prevStatus: '', nextText: '次月>‘, nextStatus: ”,
currentText: ‘今日’, currentStatus: ”,
monthNames: [‘1月’,’2月’,’3月’,’4月’,’5月’,’6月’,
‘7月’,’8月’,’9月’,’10月’,’11月’,’12月’],
monthNamesShort: [‘1月’,’2月’,’3月’,’4月’,’5月’,’6月’,
‘7月’,’8月’,’9月’,’10月’,’11月’,’12月’],
monthStatus: ”, yearStatus: ”,
weekHeader: ‘Wk’, weekStatus: ”,
dayNames: [‘日’,’月’,’火’,’水’,’木’,’金’,’土’],
dayNamesShort: [‘日’,’月’,’火’,’水’,’木’,’金’,’土’],
dayNamesMin: [‘日’,’月’,’火’,’水’,’木’,’金’,’土’],
dayStatus: ‘DD’, dateStatus: ‘D, M d’,
dateFormat: ‘yy/mm/dd’, firstDay: 0,
initStatus: ”, isRTL: false};
$.datepicker.setDefaults($.datepicker.regional[‘ja’]);
});
[/javascript]

このui.datepicker-ja.jsに和暦に変換するfunctionを追加します。
[javascript]

//Datepicker和暦表示
function convert_wareki(y, b){
var tmp;
//bがfalseの場合、西暦をそのまま返す
if(b == false){
return y;
}
//平成
if (y > 1988) {
tmp = y – 1988;
tmp = ‘平’ + tmp;
return tmp;
}
//昭和
if (y > 1925) {
tmp = y – 1925;
tmp = ‘昭’ + tmp;
return tmp;
}
//大正
if (y > 1911) {
tmp = y – 1911;
tmp = ‘大’ + tmp;
return tmp;
}
//明治
if (y > 1867) {
tmp = y – 1867;
tmp = ‘明’ + tmp;
return tmp;
}
}
[/javascript]
西暦4桁の幅と「平24」などの表記の幅が近いため、デザインを損なうことなく置き換えることができると思います。
「平成24年」などの表記にしたい場合は適宜書き換えてください。

つぎにdatepicker.jsの書き換えです。Verなどによって内容や行数が変わってしまうのでソースを検索するなどして適当な位置を書き換えてください。
[javascript]
//datepikcer.js内Datepicker部分の冒頭regional配列の初期化部分に「wareki:false」を追加する。
//wareki:trueで和暦表示、デフォルトは西暦表示になります。
this.regional[“”]={ //始まる部分

//私はisRTLの後に追加しました。
isRTL:false,showMonthAfterYear:false,

isRTL:false,wareki:false,showMonthAfterYear:false,

//次にカレンダーのHTML作成部分
//の間の変数bにconvert_warekiのfunctionを実行します。
//convert_warekiは先ほど「ui.datepicker-ja.js」に追加したfunctionです。
a.yearshtml+=’“;b<=g;b++)a.yearshtml+='“;
[/javascript]

Datepickerを実行させるページでwarekiのオプションを指定してやれば
同一ページ内でも和暦と西暦を使い分けることができます。
[html]

[/html]

スポンサーリンク
レクタングル大




コメント

  1. […] jQueryのDatepickerプラグインの年表記を和暦に変える|人生は3割の力で生き抜く JS: 西暦→和暦の変換処理 | BmathLog […]

  2. […] jQueryのDatepickerプラグインの年表記を和暦に変える|人生は3割の力で生き抜く JS: 西暦→和暦の変換処理 | BmathLog […]

  3. Pedal Blog より:

    […] jQueryのDatepickerプラグインの年表記を和暦に変える|人生は3割の力で生き抜く jQuery UIでDatepickerの日付選択時に和暦を表示する方法 jQuery Datepickerの曜日に色を付ける […]