ui.igMaskEditor
igMaskEditor コントロールにより、構成可能なマスク ルールを使用してユーザー入力テキストの書式設定と制約を制御できるようになります。この API のクラス、オプション、イベント、メソッドおよびテーマに関する詳細は、上記の関連するタブを参照してください。
igMaskEditor コントロールは、igTextEditor コントロールの機能を拡張したものです。igMaskEditor コントロールの API の詳細については、igTextEditor コントロールの API マニュアルを参照してください。
以下のコード スニペットは、igMaskEditor コントロールを初期化する方法を示します。
この API を使用して作業を開始するための情報はここをクリックしてください。igMaskEditor コントロールに必要なスクリプトとテーマを参照する方法については、Ignite UI の JavaScript リソースの使用および Ignite UI のスタイリングとテーマをご覧ください。コード サンプル
<!doctype html>
<html>
<head>
<!-- Infragistics Combined CSS -->
<link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" />
<link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" />
<!-- jQuery Core -->
<script src="js/jquery.js" type="text/javascript"></script>
<!-- jQuery UI -->
<script src="js/jquery-ui.js" type="text/javascript"></script>
<!-- Infragistics Combined Scripts -->
<script src="js/infragistics.core.js" type="text/javascript"></script>
<script src="js/infragistics.lob.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#maskEditor").igMaskEditor({
width: 160,
inputMask: "CCCCC",
nullText: "Enter Value"
});
});
</script>
</head>
<body>
<input id="maskEditor" />
</body>
</html>
関連サンプル
関連トピック
依存関係
-
allowNullValue
継承- タイプ:
- bool
- デフォルト:
- false
null 値を回避する機能を取得または設定します。
このオプションが false で、エディターに値がない場合、値は空の文字列になります。コード サンプル
//Initialize $(".selector").igMaskEditor({ allowNullValue : false }); //Get var allowNullValue = $(".selector").igMaskEditor("option", "allowNullValue"); //Set $(".selector").igMaskEditor("option", "allowNullValue", false); -
buttonType
- タイプ:
- enumeration
- デフォルト:
- none
クリア ボタンの表示状態を取得します。このオプションは、初期化時にのみ設定できます。
メンバー
- clear
- タイプ:string
- 値をクリアするボタンはエディターの右側に配置されます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ buttonType : "clear" }); //Get var button = $(".selector").igMaskEditor("option", "buttonType"); -
dataMode
- タイプ:
- enumeration
- デフォルト:
- allText
コントロールの値 (value メソッド/オプションおよびフォームでの送信) に影響します。テキスト、入力されていないプロンプト、およびリテラルからの value が含む値を定義します。デフォルト値は allText です。使用される場合、value メソッド/オプションはすべての入力したテキスト、すべてのプロンプト (位置)、およびリテラルを返します。
メンバー
- rawText
- タイプ:string
- 入力されたテキストのみ。すべての空のプロンプト (位置) およびリテラルは無視 (削除) されます。
- rawTextWithRequiredPrompts
- タイプ:string
- 入力されたテキストおよび要求されたプロンプト (位置) のみ。すべてのオプションの空のプロンプトとリテラルは無視 (削除) されます。
- rawTextWithAllPrompts
- タイプ:string
- 入力されたテキストとプロンプト (位置) のみ。すべてのリテラルは無視 (削除) されます。
- rawTextWithLiterals
- タイプ:string
- 入力されたテキストとリテラルのみ。すべての空のプロンプトは無視 (削除) されます。
- rawTextWithRequiredPromptsAndLiterals
- タイプ:string
- 入力されたテキスト、必要なプロンプト (位置) およびリテラルのみ。すべてのオプションの空のプロンプトは無視 (削除) されます。
- allText
- タイプ:string
- 入力されたテキスト、すべてのプロンプト (位置) およびリテラル。注: それはデフォルトとして使用されます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ dataMode : "rawTextWithLiterals" }); //Get var dataMode = $(".selector").igMaskEditor("option", "dataMode"); -
disabled
継承- タイプ:
- bool
- デフォルト:
- false
入力の disabled 属性を取得または設定します。True に設定される場合、入力が無効で、すべてのボタンおよび操作が無効です。エディターのフォームの送信で値が送信されません。
コード サンプル
//Initialize $(".selector").igMaskEditor({ disabled : false }); //Get var disabled = $(".selector").igMaskEditor("option", "disabled"); //Set $(".selector").igMaskEditor("option", "disabled", true); -
emptyChar
- タイプ:
- string
- デフォルト:
- " "
アプリケーションが "value" の取得または "text" の取得メソッドを呼び出すときにマスク内の埋められていない必要な位置の代用として使用する文字を取得します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ emptyChar: "*" }); //Get var emptyChar= $(".selector").igMaskEditor("option", "emptyChar"); //Set $(".selector").igMaskEditor("option", "emptyChar", "*"); -
excludeKeys
- タイプ:
- string
- デフォルト:
- null
キーボードの入力および貼り付けにより特定の文字の入力を回避する機能を取得または設定します。
注:
文字が includeKeys オプションに指定した場合、excludeKeys は優先があります。
注: オプションがランタイムに設定される場合、現在の値に適用されません。コード サンプル
//Initialize $(".selector").igMaskEditor({ excludeKeys: "ABC" }); //Get var excludedKeys= $(".selector").igMaskEditor("option", "excludeKeys"); -
height
継承- タイプ:
- enumeration
- デフォルト:
- null
コントロールの高さを取得または設定します。
メンバー
- null
- タイプ:object
- 他の高さが定義されていない場合、エディターは親コンテナーに収まります。
- string
- 高さをピクセル (px) またはパーセンテージ (%) に設定できます。
- number
- 高さをピクセル単位の数値で設定できます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ height : 25 }); //Get var height = $(".selector").igMaskEditor("option", "height"); //Set $(".selector").igMaskEditor("option", "height", 25); -
includeKeys
- タイプ:
- string
- デフォルト:
- null
キーボードの入力および貼り付けにより入力フィールドで特定の文字のみを許可する機能を取得または設定します。
注:
"excludeKeys" オプションがこのオプションと同じ文字を含んでいる場合、"excludeKeys" が優先されます。
オプションがランタイムに設定される場合、現在の値に適用されません。コード サンプル
//Initialize $(".selector").igMaskEditor({ includeKeys: "ABC" }); //Get var includedKeys= $(".selector").igMaskEditor("option", "includeKeys"); -
inputMask
- タイプ:
- string
- デフォルト:
- "CCCCCCCCCC"
入力マスクを取得します。マスクには、フィルター フラグやリテラル文字が含まれる場合があります。
リテラル文字は、エンドユーザーが変更できないマスクの一部です。フィルター フラグをリテラル文字として使用するには、エスケープ "\\" 文字を使用する必要があります。
デフォルトは "CCCCCCCCCC" です。
注: オプションのフラグ/エントリは、"value" の取得または "text" の取得メソッドが返す値に影響します。
フィルター フラグのリスト。
C: 任意のキーボード文字。エントリはオプションです。
&: 任意のキーボード文字。エントリは必須です。
a: 文字または数字。エントリはオプションです。
A: 文字または数字。エントリは必須です。
?: 通常の文字。エントリはオプションです。
L: 通常の文字。エントリは必須です。
9: 数字。エントリはオプションです。
0: 数字。エントリは必須です。
#: 数字、"+"、または "_"。エントリはオプションです。"emptyPositionChar" または "padChar" で代用できます。
>: 右にあるすべての文字が大文字に変換されます。変換を無効にするには、">" フラグをもう一度使用します。
<: 右にあるすべての文字が小文字に変換されます。変換を無効にするには、"<" フラグをもう一度使用します。
注: このオプションはランタイムで設定できません。コード サンプル
//Initialize $(".selector").igMaskEditor({ inputMask : "cccccccccc" }); //Get var inputMask = $(".selector").igMaskEditor("option", "inputMask"); -
inputName
継承- タイプ:
- string
- デフォルト:
- null
値入力の名前属性を取得または設定します。入力はサーバーへ値を送信するために使用されます。ターゲット要素が入力で名前要素があり、開発者が inputName オプションに設定した場合、このオプションは値入力を上書きし要素の属性を削除します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ inputName : "textField" }); //Get var inputName = $(".selector").igMaskEditor("option", "inputName"); //Set $(".selector").igMaskEditor("option", "inputName", "textField"); -
language
継承- タイプ:
- string
- デフォルト:
- "en"
ウィジェットのロケール言語設定を取得または設定します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ language: "ja" }); // Get var language = $(".selector").igMaskEditor("option", "language"); // Set $(".selector").igMaskEditor("option", "language", "ja"); -
locale
継承- タイプ:
- object
- デフォルト:
- null
ウィジェットのロケール設定を取得または設定します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ locale: {} }); // Get var locale = $(".selector").igMaskEditor("option", "locale"); // Set $(".selector").igMaskEditor("option", "locale", {}); -
nullValue
継承- タイプ:
- enumeration
- デフォルト:
- null
エディター値が null 値になることが可能かどうかを取得または設定します。デフォルトの場合、入力の値は null に設定され、入力が空文字列を保持します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ nullValue : null }); //Get var nullValue = $(".selector").igMaskEditor("option", "nullValue"); //Set $(".selector").igMaskEditor("option", "nullValue", null); -
padChar
- タイプ:
- string
- デフォルト:
- " "
エディターが表示モード (フォーカスなし) のときにマスク内の埋められていない必要な位置の代用として使用する文字を取得します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ padChar: "*" }); //Get var padChar= $(".selector").igMaskEditor"option", "padChar"); //Set $(".selector").igMaskEditor("option", "padChar", "*"); -
placeHolder
継承- タイプ:
- string
- デフォルト:
- null
エディターがフォーカスを持たず、エディター内の "value" が null または空の文字列ときのエディターに表示されるテキストを取得または設定します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ placeHolder : "Enter Value" }); //Get var placeHolder = $(".selector").igMaskEditor("option", "placeHolder"); //Set $(".selector").igMaskEditor("option", "placeHolder", "Enter Value"); -
preventSubmitOnEnter
継承- タイプ:
- bool
- デフォルト:
- false
Enter キーの押下でフォーム送信を回避する機能を取得または設定します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ preventSubmitOnEnter: true }); //Get var preventSubmitOnEnter = $(".selector").igMaskEditor("option", "preventSubmitOnEnter"); //Set $(".selector").igMaskEditor("option", "preventSubmitOnEnter", true); -
readOnly
継承- タイプ:
- bool
- デフォルト:
- false
入力の readonly 属性を取得または設定します。True に設定される場合、入力が読み取り専用で、すべてのボタンおよび操作が無効です。エディターのフォームの送信で値が送信されます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ readOnly : true }); //Get var readOnly = $(".selector").igMaskEditor("option", "readOnly"); //Set $(".selector").igMaskEditor("option", "readOnly", true); -
regional
継承- タイプ:
- enumeration
- デフォルト:
- en-US
ウィジェットの領域設定を取得または設定します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ regional: "ja" }); // Get var regional = $(".selector").igMaskEditor("option", "regional"); // Set $(".selector").igMaskEditor("option", "regional", "ja"); -
revertIfNotValid
継承- タイプ:
- bool
- デフォルト:
- true
ぼかしまたは Enter キーの押しで値が無効な場合、エディターが値を以前の有効な値を元に戻す機能を取得または設定します。オプションが false に設定される場合、エディターはクリア機能を呼び出します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ revertIfNotValid : false }); //Get var revertIfNotValid = $(".selector").igMaskEditor("option", "revertIfNotValid"); //Set $(".selector").igMaskEditor("option", "revertIfNotValid", false); -
selectionOnFocus
継承- タイプ:
- enumeration
- デフォルト:
- selectAll
エディターがフォーカスを取得したときの動作を取得または設定します。デフォルト値は selectAll です。
メンバー
- selectAll
- タイプ:string
- このオプションを設定すると、編集モードに入ったときにエディターのすべてのテキストを選択します。
- atStart
- タイプ:string
- このオプションを設定すると、編集モードに入ったときにエディターのテキストの初めにカーソルを移動します。
- atEnd
- タイプ:string
- このオプションを設定すると、編集モードに入ったときにエディターのテキストの最後にカーソルを移動します。
- browserDefault
- タイプ:string
- このオプションの設定に追加のロジックはありませんが、ブラウザーのデフォルトの動作で処理されます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ selectionOnFocus: "atStart" }); //Get var selectionOnFocus= $(".selector").igMaskEditor("option", "selectionOnFocus"); //Set $(".selector").igMaskEditor("option", "selectionOnFocus", "selectAll"); -
suppressNotifications
継承- タイプ:
- bool
- デフォルト:
- false
エディターのビルトイン基本検証シナリオで、必須リスト選択、値ラッピング、スピン制限などのデフォルトの通知を有効/無効にします。
コード サンプル
//Initialize $(".selector").igMaskEditor({ suppressNotifications : true }); //Get var suppressNotifications = $(".selector").igMaskEditor("option", "suppressNotifications"); //Set $(".selector").igMaskEditor("option", "suppressNotifications", true); -
tabIndex
継承- タイプ:
- number
- デフォルト:
- null
エディター入力の tabIndex 属性を取得または設定します。
コード サンプル
//Initialize $('.selector').igMaskEditor({ tabIndex: 1 }); //Get var tabIndex = $(".selector").igMaskEditor("option", "tabIndex"); //Set $(".selector").igMaskEditor("option", "tabIndex", 1); -
textAlign
継承- タイプ:
- enumeration
- デフォルト:
- left
エディター内のテキストの水平配置を取得または設定します。そのオプションが設定されない場合、'numeric'、'currency'、および 'percent' エディターの 'right' のデフォルト値が使用されます。
メンバー
- left
- タイプ:string
- 入力したテキストは左揃えになります。
- right
- タイプ:string
- 入力したテキストは右揃えになります。
- center
- タイプ:string
- 入力したテキストは中央揃えになります。
コード サンプル
//Initialize $(".selector").igMaskEditor({ textAlign : "center" }); //Get var align = $(".selector").igMaskEditor("option", "textAlign"); //Set $(".selector").igMaskEditor("option", "textAlign", "center"); -
toLower
継承- タイプ:
- bool
- デフォルト:
- false
True の場合は、入力された文字列を小文字に変換し、False の場合は、文字列をそのままにしておく機能を取得または設定します。このオプションは、キーボード入力と貼り付けを使用する場合のみ効果があります。注: オプションがランタイムに設定される場合、エディターは現在の値を変更しません。
コード サンプル
//Initialize $(".selector").igMaskEditor({ toLower : true }); //Get var toLower = $(".selector").igMaskEditor("option", "toLower"); //Set $(".selector").igMaskEditor("option", "toLower", true); -
toUpper
継承- タイプ:
- bool
- デフォルト:
- false
True の場合は、入力された文字列を大文字に変換し、False の場合は、文字列をそのままにしておく機能を取得または設定します。このオプションは、キーボード入力と貼り付けを使用する場合のみ効果があります。注: オプションがランタイムに設定される場合、エディターは現在の値を変更しません。
コード サンプル
//Initialize $(".selector").igMaskEditor({ toUpper : true }); //Get var toUpper = $(".selector").igMaskEditor("option", "toUpper"); //Set $(".selector").igMaskEditor("option", "toUpper", true); -
unfilledCharsPrompt
- タイプ:
- string
- デフォルト:
- "_"
使用可能な入力位置の編集モードのプロンプトとして使用する文字を取得します。
コード サンプル
//Initialize $(".selector").igMaskEditor({ unfilledCharsPrompt : "*" }); //Get var prompt = $(".selector").igMaskEditor("option", "unfilledCharsPrompt"); -
validatorOptions
継承- タイプ:
- object
- デフォルト:
- null
igValidator ウィジェットによってサポートされるオプションを取得または設定します。
注: エラーをトリガーした際に igValidator の検証ルールは最小値/長さおよび最大値/長さを別々に適用します。エディターの対応するオプションは、定義された入力規則に反する値の入力を防止します。コード サンプル
//Initialize $(".selector").igMaskEditor({ validatorOptions : { successMessage: "Success", required: true, onchange: true, notificationOptions: { mode: "popover" } } }); //Get var validateOptions = $(".selector").igMaskEditor("option", "validatorOptions"); //Set $(".selector").igMaskEditor("option", "validatorOptions", {onblur: true, onchange: true}); -
value
- タイプ:
- object
- デフォルト:
- null
エディター内の値を取得または設定します。エディターのタイプおよび各エディター タイプの dataMode オプションに基づいたオプションを取得または設定する効果。
コード サンプル
//Initialize $(".selector").igMaskEditor({ value : "0415565685" }); //Get var value = $(".selector").igMaskEditor("option", "value"); //Set $(".selector").igMaskEditor("option", "value", "0415565685"); -
width
継承- タイプ:
- enumeration
- デフォルト:
- null
コントロールの幅を取得または設定します。
メンバー
- null
- タイプ:object
- 他の幅が定義されていない場合、データに合わせて引き伸ばされます。
- string
- ウィジェットの幅をピクセル (px) またはパーセンテージ (%) に設定できます。
- number
- ウィジェットの幅は数値としてピクセルで設定できます。
コード サンプル
//Initialize $(".selector").igMaskEditor({ width : 200 }); //Get var width = $(".selector").igMaskEditor("option", "width"); //Set $(".selector").igMaskEditor("option", "width", 200);
Ignite UI コントロール イベントの詳細については、
Ignite UI でイベントを使用するを参照してください。
-
blur
継承- キャンセル可能:
- false
エディターの入力フィールドがフォーカスを失ったとき発生するイベント。
関数は引数 evt を取得します。
ui.owner を使用して igEditor への参照を取得します。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。コード サンプル
$(".selector").on("igmaskeditorblur", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ blur: function (evt, ui) { ... } }); -
focus
継承- キャンセル可能:
- false
エディターの入力フィールドがフォーカスを取得したとき発生するイベント。
関数は引数 evt を取得します。
ui.owner を使用して igEditor への参照を取得します。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。コード サンプル
$(".selector").on("igmaskeditorfocus", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ focus: function (evt, ui) { ... } }); -
keydown
継承- キャンセル可能:
- true
keydown イベントに対して発生するイベント。
キー操作をキャンセルするには、False を返します。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.key を使用して keyCode の値を取得します。コード サンプル
$(".selector").on("igmaskeditorkeydown", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ keydown: function (evt, ui) { ... } }); -
keypress
継承- キャンセル可能:
- true
keypress イベントに対して発生するイベント。
キー操作をキャンセルするには、False を返します。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.key を使用して keyCode の値を取得します。
ui.key を元のエントリを置き換える別の文字に設定します。コード サンプル
$(".selector").on("igmaskeditorkeypress", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ keypress: function (evt, ui) { ... } }); -
keyup
継承- キャンセル可能:
- false
keyup イベントに対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.key を使用して keyCode の値を取得します。コード サンプル
$(".selector").on("igmaskeditorkeyup", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ keyup: function (evt, ui) { ... } }); -
mousedown
継承- キャンセル可能:
- false
ドロップダウン リストを含むエディターの任意の部分での mousedown に対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.elementType を使用して、マウス位置の HTML 要素のタイプ (field、button、spinUpper、spinLower、または item# など) を取得します。
ui.id および ui.elementType を使用して、マウス位置の HTML 要素を表すフラグを取得します。コード サンプル
$(".selector").on("igmaskeditormousedown", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ mousedown: function (evt, ui) { ... } }); -
mousemove
継承- キャンセル可能:
- false
ドロップダウン リストを含むエディターの任意の部分での mousemove に対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.elementType を使用して、マウス位置の HTML 要素のタイプ (field、button、spinUpper、spinLower、または item# など) を取得します。
ui.id および ui.elementType を使用して、マウス位置の HTML 要素を表すフラグを取得します。コード サンプル
$(".selector").on("igmaskeditormousemove", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ mousemove: function (evt, ui) { ... } }); -
mouseout
継承- キャンセル可能:
- false
ドロップダウン リストを含むエディターの任意の部分での mouseleave に対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.elementType を使用して、マウス位置の HTML 要素のタイプ (field、button、spinUpper、spinLower、または item# など) を取得します。
ui.id および ui.elementType を使用して、マウス位置の HTML 要素を表すフラグを取得します。コード サンプル
$(".selector").on("igmaskeditormouseout", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ mouseout: function (evt, ui) { ... } }); -
mouseover
継承- キャンセル可能:
- false
ドロップダウン リストを含むエディターの任意の部分での mouseover に対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.elementType を使用して、マウス位置の HTML 要素のタイプ (field、button、spinUpper、spinLower、または item# など) を取得します。
ui.id および ui.elementType を使用して、マウス位置の HTML 要素を表すフラグを取得します。コード サンプル
$(".selector").on("igmaskeditormouseover", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ mouseover: function (evt, ui) { ... } }); -
mouseup
継承- キャンセル可能:
- false
ドロップダウン リストを含むエディターの任意の部分での mouseup に対して発生するイベント。
関数は引数 evt および ui を受け取ります。
evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
ui.owner を使用して igEditor への参照を取得します。
ui.elementType を使用して、マウス位置の HTML 要素のタイプ (field、button、spinUpper、spinLower、または item# など) を取得します。
ui.id および ui.elementType を使用して、マウス位置の HTML 要素を表すフラグを取得します。コード サンプル
$(".selector").on("igmaskeditormouseup", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ mouseup: function (evt, ui) { ... } }); -
rendered
継承- キャンセル可能:
- false
エディターの描画が完了した後に発生するイベント。
関数は引数 evt および ui を受け取ります。
ui.owner を使用して、レンダリングを実行するエディターへの参照を取得します。
ui.element を使用して、エディター要素への参照を取得します。コード サンプル
$(".selector").on("igmaskeditorrendered", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ rendered: function (evt, ui) { ... } }); -
rendering
継承- キャンセル可能:
- false
エディターの描画が完了する前に発生するイベント。
関数は引数 evt および ui を受け取ります。
ui.owner を使用して、レンダリングを実行するエディターへの参照を取得します。
ui.element を使用して、エディター要素への参照を取得します。コード サンプル
$(".selector").on("igmaskeditorrendering", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ rendering: function (evt, ui) { ... } }); -
textChanged
継承- キャンセル可能:
- false
エディター内のテキストが変更された後に発生するイベント。keyUp イベントが発生するときに発生できます。
または、クリアボタンがクリックされたときまたはリストの項目がせんたくされたときに発生できます。
関数は引数 evt および ui を受け取ります。
ui.owner を使用して igEditor への参照を取得します。
ui.text を使用して、新しいテキストを取得します。
古いテキストの取得に ui.oldText を使用します。コード サンプル
$(".selector").on("igmaskeditortextchanged", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ textChanged: function (evt, ui) { ... } }); -
valueChanged
継承- キャンセル可能:
- false
エディター内の値が変更された後に発生するイベント。フォーカスの消失またはスピン イベントに対して発生します。
関数は引数 evt および ui を受け取ります。
ui.owner を使用して igEditor への参照を取得します。
内部書式設定の後にユーザーが入力した値を取得するには ui.newValue を使用します。
内部書式設定の前にユーザーが入力した値を取得するには ui.originalValue を使用します。
ui.editorInput を使用して、エディター入力への参照を取得します。コード サンプル
$(".selector").on("igmaskeditorvaluechanged", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ valueChanged: function (evt, ui) { ... } }); -
valueChanging
継承- キャンセル可能:
- true
エディター内の値が変更される前に発生するイベント。
変更をキャンセルするには、False を返します。
フォーカスの消失またはスピン イベントに対して発生します。
関数は引数 evt および ui を受け取ります。
ui.owner を使用して igEditor への参照を取得します。
ui.newValue を使用して新しい値を取得します。
ui.originalValue を使用して、元の値を取得します。
ui.editorInput を使用して、エディター入力への参照を取得します。コード サンプル
$(".selector").on("igmaskeditorvaluechanging", function (evt, ui) { ... }); //Initialize $(".selector").igMaskEditor({ valueChanging: function (evt, ui) { ... } });
-
changeGlobalLanguage
継承- .igMaskEditor( "changeGlobalLanguage" );
ウィジェットの言語をグローバルの言語に変更します。グローバルの言語は $.ig.util.language の値です。
コード サンプル
$(".selector").igMaskEditor("changeGlobalLanguage"); -
changeGlobalRegional
継承- .igMaskEditor( "changeGlobalRegional" );
ウィジェットの地域設定をグローバルの地域設定に変更します。グローバルの地域設定は $.ig.util.regional にあります。
コード サンプル
$(".selector").igMaskEditor("changeGlobalRegional"); -
changeLocale
継承- .igMaskEditor( "changeLocale" );
ウィジェット要素のすべてのロケールを options.language に指定される言語に変更します。
注: このメソッドは珍しいシナリオのみで使用されます。language または locale オプションのセッターを参照してください。コード サンプル
$(".selector").igMaskEditor("changeLocale"); -
clearButton
継承- .igMaskEditor( "clearButton" );
- 返却型:
- jquery
- 返却型の説明:
- jQuery オブジェクトへの参照を返します。
エディターのクリア ボタン UI 要素への参照を返します。
returnType="$"。jquery オブジェクトへの参照を返します。コード サンプル
var button = $(".selector").igMaskEditor("clearButton"); -
destroy
継承- .igMaskEditor( "destroy" );
ウィジェットを破棄します。
コード サンプル
$(".selector").igMaskEditor("destroy"); -
displayValue
継承- .igMaskEditor( "displayValue" );
- 返却型:
- string
- 返却型の説明:
- エディターの表示テキスト。
エディターに表示するテキストを取得します。
コード サンプル
$(".selector").igMaskEditor("displayValue"); -
editorContainer
継承- .igMaskEditor( "editorContainer" );
- 返却型:
- jquery
- 返却型の説明:
- コンテナー エディター要素。
エディターをラップする jQuery 要素への参照を取得します。
コード サンプル
$(".selector").igMaskEditor("editorContainer"); -
field
継承- .igMaskEditor( "field" );
- 返却型:
- jquery
- 返却型の説明:
- 視覚エディター要素。
エディターの入力要素を取得します。
returnType="$" 視覚エディター要素。コード サンプル
$(".selector").igMaskEditor("field"); -
getSelectedText
継承- .igMaskEditor( "getSelectedText" );
- 返却型:
- string
- 返却型の説明:
- エディターで選択されたテキスト。
編集モードでエディターから選択されたテキストを取得します。keydown または keyup などのキー イベント ハンドラーで可能です。このメソッドはエディターにフォーカスがある場合のみ使用できます。エディターにフォーカスがない状態でこのメソッドを呼び出した場合、空文字列になる場合があります。
コード サンプル
var text = (".selector").igMaskEditor("getSelectedText"); -
getSelectionEnd
継承- .igMaskEditor( "getSelectionEnd" );
- 返却型:
- number
- 返却型の説明:
- エディターで選択されたテキストの終了インデックス。
エディターで選択されたテキストの終了インデックスを取得します。
コード サンプル
var intex = $(".selector").igMaskEditor("getSelectionEnd"); -
getSelectionStart
継承- .igMaskEditor( "getSelectionStart" );
- 返却型:
- number
- 返却型の説明:
- エディターで選択されたテキストの開始インデックス。
エディターで選択されたテキストの開始インデックスを取得します。
コード サンプル
var intex = $(".selector").igMaskEditor("getSelectionStart"); -
hasFocus
継承- .igMaskEditor( "hasFocus" );
- 返却型:
- bool
- 返却型の説明:
- エディターがフォーカスされるかどうかを返します。
エディターがフォーカスを持つかどうかを取得します。
コード サンプル
$(".selector").igMaskEditor("hasFocus"); -
hide
継承- .igMaskEditor( "hide" );
エディターを非表示にします。
コード サンプル
$(".selector").igMaskEditor("hide"); -
inputName
継承- .igMaskEditor( "inputName", [newValue:string] );
- 返却型:
- string
- 返却型の説明:
- 現在の入力名。
エディター要素に適用される名前属性を取得または設定します。
- newValue
- タイプ:string
- オプション
- 新しい入力名。
コード サンプル
$(".selector").igMaskEditor("inputName", "checkbox"); -
insert
継承- .igMaskEditor( "insert", string:string );
カレットの位置、または現在選択を上書きしてテキストを挿入します。エディターがフォーカスを持つ場合、このメソッドは現在選択を上書きしてテキストを挿入します。エディターがフォーカスを持たない場合、このメソッドはエディターの値をテキストに設定します。注: メソッドは textChanged イベントを発生させます。
- string
- タイプ:string
- 挿入する文字列。
コード サンプル
$('.selector').igMaskEditor({ blur: function (evt, ui) { // insert 0 as the user leaves the field ui.owner.insert("0"); } }); $(".selector").igMaskEditor("insert", "20"); -
isValid
- .igMaskEditor( "isValid" );
- 返却型:
- bool
- 返却型の説明:
- 編集値が有効化どうか。
エディター内の値が値かどうかチェックします。注: この機能は自動通知をトリガーしません。
コード サンプル
var isValid = $(".selector").igMaskEditor("isValid"); -
select
継承- .igMaskEditor( "select", start:number, end:number );
エディターで開始インデックスおよび終了インデックスの間のテキストを選択します。パラメーターが等しい場合、このメソッドはカレットの場所を設定します。このメソッドはエディターにフォーカスがある場合のみ効果があります。
- start
- タイプ:number
- 選択の開始。
- end
- タイプ:number
- 選択の終了。
コード サンプル
$(".selector").igMaskEditor("select", 2, 4); -
setFocus
継承- .igMaskEditor( "setFocus", [delay:number] );
指定した遅延時間の後にフォーカスをエディターに設定します。
- delay
- タイプ:number
- オプション
- エディターにフォーカスする前の遅延。
コード サンプル
$(".selector").igMaskEditor("setFocus", 200); -
show
継承- .igMaskEditor( "show" );
エディターを表示します。
コード サンプル
$(".selector").igMaskEditor(("show"); -
validate
継承- .igMaskEditor( "validate" );
- 返却型:
- bool
- 返却型の説明:
- 編集値が有効化どうか。
エディターの検証をトリガーします。validatorOptions を設定すると igValidator で検証も呼び出されます。
コード サンプル
var valid = $(".selector").igMaskEditor("validate"); -
validator
継承- .igMaskEditor( "validator" );
- 返却型:
- object
- 返却型の説明:
- igValidator への参照または null を返します。
エディターで使用される igValidator への参照を取得します。
コード サンプル
var validator = $(".selector").igMaskEditor("validator"); -
value
- .igMaskEditor( "value", [newValue:string] );
- 返却型:
- string
- 返却型の説明:
- 現在のマスク エディターの値。
マスク エディター値を取得または設定します。
- newValue
- タイプ:string
- オプション
- 新しいマスク エディターの値。
コード サンプル
$(".selector").igMaskEditor("value", "New Text");
-
ui-state-active
- エディターがアクティブなときに最上位の要素に適用されるクラス。デフォルト値は 'ui-state-active' です。
-
ui-igedit-button-common ui-unselectable
- すべてのボタン コンテナーに適用されるクラス。デフォルト値は 'ui-igedit-button-common ui-unselectable ui-igedit-button-ltr ui-state-default' です。
-
ui-igedit-buttonhover ui-state-hover
- マウス オーバー状態のボタンの SPAN 要素に適用されるクラス。デフォルト値は 'ui-igedit-buttonhover ui-state-hover' です。
-
ui-igedit-buttonpressed ui-state-highlight
- 押下状態のボタンの SPAN 要素に適用されるクラス。デフォルト値は 'ui-igedit-buttonpressed ui-state-highlight' です。
-
ui-igedit-cleararea ui-state-default
- クリア ボタンを保持する DIV 要素に適用されるクラス。デフォルト値は 'ui-igedit-cleararea ui-state-default' です。
-
ui-igedit-buttonimage ui-icon-circle-close
- クリア ボタン画像を保持する DIV 要素に適用されるクラス。デフォルト値は 'ui-igedit-buttonimage ui-icon-circle-close ui-icon ui-igedit-buttondefault' です。
-
ui-igedit ui-igedit-container ui-widget ui-corner-all ui-state-default
- エディターがコンテナーに描画される場合に最上位の要素に適用されるクラス。デフォルト値は、'ui-igedit ui-igedit-container ui-widget ui-corner-all ui-state-default' です。
-
ui-state-disabled
- 無効な状態の編集要素に適用されるクラス。デフォルト値は 'ui-igedit-disabled ui-state-disabled' です。
-
ui-igedit-dropdown-button
- ドロップ ダウン ボタンを保持する DIV 要素に適用されるクラス。デフォルト値は 'ui-igedit-dropdown-button' です。
-
ui-icon ui-icon-triangle-1-s ui-igedit-buttonimage
- ドロップ ダウン ボタン画像を保持する DIV 要素に適用されるクラス。デフォルト値は、'ui-icon ui-icon-carat-1-s ui-igedit-buttonimage' です。
-
ui-igedit-dropdown ui-widget
- listitems を保持するコンテナーに適用されるクラス。デフォルト値は 'ui-igedit-dropdown' です。
-
ui-igedit-input
- メイン/最上位の要素に適用されるクラス。デフォルト値は 'ui-igedit-input' です。
-
ui-igeditor-input-container ui-corner-all
- 編集可能な入力をラップする div に適用されたクラス (multiline textarea の場合)。デフォルト値は、"ui-igeditor-input-container ui-corner-all"。
-
ui-state-focus
- エディターがフォーカスされるときに最上位の要素に適用されるクラス。デフォルト値は 'ui-state-focus' です。
-
ui-state-hover
- エディターがホバーされるときに最上位の要素に適用されるクラス。デフォルト値は 'ui-state-hover' です。
-
ui-igedit-listitem ui-state-default
- ドロップダウン リスト内の項目を表す SPAN 要素に適用されるクラス。デフォルト値は 'ui-igedit-listitem ui-state-default' です。
-
ui-state-active ui-igedit-listitemactive
- ドロップダウン リスト内のアクティブ項目を表す SPAN 要素に適用されるクラスに適用されるクラス。デフォルト値は 'ui-igedit-listitemselected ui-state-highlight' です。
-
ui-igedit-listitemhover ui-state-hover
- マウス オーバー状態のドロップダウン リスト内の項目を表す SPAN 要素に適用されるクラスに適用されるクラス。デフォルト値は 'ui-igedit-listitemhover ui-state-hover' です。
-
ui-igedit-listitemselected ui-state-highlight
- ドロップダウン リスト内の選択項目を表す SPAN 要素に適用されるクラスに適用されるクラス。デフォルト値は 'ui-igedit-listitemselected ui-state-highlight' です。
-
ui-igedit-placeholder
- plaseHolder オプションを設定した場合に表示可能な入力に適用されるクラス。このクラスは、スタイリングのみに関連します。デフォルト値は 'ui-igedit-placeholder' です。
-
ui-igedit-spinlowerimage ui-icon-carat-1-s ui-icon
- スピン ダウン画像を保持する DIV 要素に適用されるクラス。デフォルト値は、'ui-igedit-spinlowerimage ui-icon-carat-1-s ui-icon ui-igedit-buttondefault ui-igedit-spinbutton ui-igedit-buttonimage' です。
-
ui-igedit-spinupperimage ui-icon-carat-1-n ui-icon
- スピン アップ画像を保持する DIV 要素に適用されるクラス。デフォルト値は、'ui-igedit-spinupperimage ui-icon-carat-1-n ui-icon ui-igedit-buttondefault ui-igedit-spinbutton ui-igedit-buttonimage' です。
-
ui-igedit-textarea
- textMode が 'multiline' に設定される場合、可視 textarea 要素に適用されるクラス。