MTAppjQuery P7

MTAppNumChecker

数値入力欄の値を blur 時に整形（全角→半角・余分な文字除去）し、最小値・最大値を外れたら警告メッセージを表示する jQuery プラグイン。

数値入力欄の値を、フォーカスが外れた（blur）タイミングで整形・検証する jQuery プラグインです。全角数字を半角へ変換し、半角数字以外の余分な文字を取り除いたうえで入力欄に書き戻します。さらに最小値・最大値を指定すると、範囲を外れたときに入力欄の直後へ警告メッセージを表示します。

構文

$(selector).MTAppNumChecker(options);

$.fn プラグイン（$(selector).MTAppNumChecker(...)）です。対象要素（this）を返すのでチェーンできます。

パラメータ

options {Object} — 省略可。以下のプロパティを持ちます。

プロパティ	型	既定値	説明
`min`	number	`-9999999999`	最小値。これを下回ると `minMsg` を表示する。既定値のままなら最小値チェックは行わない
`max`	number	`9999999999`	最大値。これを上回ると `maxMsg` を表示する。既定値のままなら最大値チェックは行わない
`minMsg`	string	`値が小さすぎます。`	最小値を下回ったときに表示するメッセージ
`maxMsg`	string	`値が大きすぎます。`	最大値を上回ったときに表示するメッセージ
`zeroPad`	boolean	`false`	`true` で先頭の `0` を残す。`false`（既定）では先頭の `0` を取り除く
`min_msg`	string	—	非推奨: `minMsg` のエイリアス。`minMsg` 未指定時のみ採用
`max_msg`	string	—	非推奨: `maxMsg` のエイリアス。`maxMsg` 未指定時のみ採用
`zero_pad`	boolean	—	非推奨: `zeroPad` のエイリアス。`zeroPad` 未指定時のみ採用

戻り値

{jQuery} — 対象要素（チェーン可能）。

保存される値

整形後の数値文字列が保存されます（全角→半角、全角の句読点・ダッシュの正規化、前後の空白除去、zeroPad: false のとき先頭の 0 を除去）。例: １，２３４．５ → 1,234.5。範囲チェックはメッセージ表示のみで、フィールドに保存されるのは整形後のテキストです。

使用例

範囲チェック付き（10〜100）

$('#customfield_price').MTAppNumChecker({ min: 10, max: 100 });

user.js での記述例

user.js（「デザイン → user.js を編集」）に書く場合は、mtappVars.screen_id で画面を判定して呼び出します。

(function ($) {
    if (typeof mtappVars !== 'object') return;
    if (mtappVars.screen_id === 'edit-entry') {
        $('#customfield_price').MTAppNumChecker({ min: 10, max: 100 });
    }
})(jQuery);

整形のみ（全角→半角・余分な文字除去）

// min/max を指定しなければメッセージは出ず、値の整形だけ行う
$('#customfield_code').MTAppNumChecker();

メッセージと先頭ゼロ保持をカスタマイズ

$('#customfield_count').MTAppNumChecker({
    min: 1,
    minMsg: '1 以上を入力してください。',
    zeroPad: true   // "007" をそのまま保持
});

生成される HTML

対象要素の直後に、警告メッセージ表示用の <span class="mun_msg"> が 1 つ追加されます（初期状態は非表示）。

<input type="text" id="customfield_price" class="text">
<span class="mun_msg" style="display: none;"></span>

範囲を外れると、この span にメッセージが入って表示されます。文字色（赤）・太字はスタイルシート（.mun_msg）で指定しています。

補足

検証・整形は blur.mtappnumchecker ハンドラで行います。入力中ではなく、欄からフォーカスが外れた時点で実行されます。
入力欄に書き戻す値（表示用の整形）と、範囲判定に使う数値は別物です。
- 書き戻し: 全角数字を半角化し、全角の ．。→.、，、→,、各種ダッシュ（ーｰ − —）→- に正規化したうえで前後の空白を除去します（zeroPad: false なら先頭の 0 も除去）。たとえば １，２３４．５ は 1,234.5 になります。
- 範囲判定: 書き戻した値からカンマなど数字・小数点・マイナス以外を取り除いた数で比較します。1,234.5 は 1234.5 として判定されます。
全角→半角変換は内部ヘルパー $.toInt（Util.pm 由来のユーティリティ）に依存します。
min / max のいずれかを既定値以外に設定したときだけ範囲判定が動きます。両方とも既定値のままなら整形のみ行い、メッセージは出ません。
空欄は数値 0 として扱われます。そのため min に正の値を設定している場合、空欄のままフォーカスを外すと minMsg が表示されます。
非推奨エイリアス（min_msg / max_msg / zero_pad）は、対応する正式名が未指定のときだけ採用されます。新規実装では正式名（minMsg / maxMsg / zeroPad）を使ってください。

構文