ui.igDatePicker

ui.igDatePicker_image

igDatePicker コントロール は igDateEditor コントロールの機能を拡張したもので、jQuery UI Datepicker スクリプトを (jquery.ui.datepicker.js) ページに含める必要があります。igDatePicker コントロールの API の詳細については、igDateEditor および igEditor コントロールの API マニュアルを参照してください。jQuery UI 日付ピッカーの詳細については、jQuery UI オンライン ヘルプ (英語) を参照してください。この API のクラス、オプション、イベント、メソッドおよびテーマに関する詳細は、上記の関連するタブを参照してください。

以下のコード スニペットは、igDatePicker コントロールを初期化する方法を示します。

この API を使用して作業を開始するための情報はここをクリックしてください。igDatePicker コントロールに必要なスクリプトとテーマを参照する方法については、Ignite UI の JavaScript リソースの使用および Ignite UI のスタイリングとテーマをご覧ください。

コード サンプル

 
      <!doctype html>
      <html>
      <head>
          <title>Ignite UI igDatePicker</title>
          <!-- 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 () {
                  $("#datePicker").igDatePicker({
                      width: 280,
                      dateInputFormat: "dateTime",
                      regional: "en-US",
                      placeHolder: "Pick Date",
                      datepickerOptions: {
                          showWeek: true
                      }
                  });
              });
          </script>
      </head>
      <body>
          <input id="datePicker" />
      </body>
      </html>

関連サンプル

関連トピック

依存関係

jquery-1.9.1.js
jquery.ui-1.9.0.js
infragistics.util.js
infragistics.ui.scroll.js
infragistics.ui.validator.js

継承

  • allowNullValue
    継承

    タイプ:
    bool
    デフォルト:
    false

    null 値を回避する機能を取得または設定します。
    このオプションが false で、エディターに値がない場合、値は空の文字列になります。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
          allowNullValue: true
        });
 
        //Get
        var allowNullValue = $(".selector").igDatePicker("option", "allowNullValue");
 
        //Set
        $(".selector").igDatePicker("option", "allowNullValue", true);

  • buttonType

    タイプ:
    enumeration
    デフォルト:
    dropdown

    スピン、クリア、およびドロップダウン ボタンの可視性を取得します。このオプションは、初期化時にのみ設定できます。「dropdown,clear」または「dropdownclear'」などの組み合わせもサポートされています。

    メンバー

    • dropdown
    • タイプ:string
    • リストを開く/閉じるボタンはエディターの右側に配置されます。
    • clear
    • タイプ:string
    • 値をクリアするボタンはエディターの右側に配置されます。
    • spin
    • タイプ:string
    • スピン ボタンはエディターの右側に配置されます。

    コード サンプル

     
      //Initialize
          $(".selector").igDatePicker({
              buttonType : "clear"
          });

          //Get
          var buttonType = $(".selector").igDatePicker("option", "buttonType");

          //Set
          $(".selector").igDatePicker("option", "buttonType", "clear");

  • centuryThreshold
    継承

    タイプ:
    number
    デフォルト:
    29

    20 世紀および 21 世紀の自動検出の年を取得または設定します。
    このオプションは、ユーザーが 1 桁または 2 桁を年フィールドに入力した場合、または日付パターンが 1 年または ２年位置のみ ("yy" または "y" など) を含む場合に自動的に塗りつぶすために使用されます。
    ユーザーがこのオプションの値よりも大きな値を入力した場合、20 世紀を使用します。それ以外の場合は、21 世紀を使用します。

    コード サンプル

     //Initialize
        $(".selector").igDatePicker({
            centuryThreshold: 35
        });
        
        //Get
        var centuryThreshold = $(".selector").igDatePicker("option", "centuryThreshold");
        
        //Set
        $(".selector").igDatePicker("option", "centuryThreshold", 35);

  • dataMode
    継承

    タイプ:
    enumeration
    デフォルト:
    date

    value() メソッドの get によって返された値のタイプを取得または設定します。また、value(val) メソッドの set の機能や、ブラウザーのコピー/貼り付け操作にも影響します。注: それはデフォルトとして使用されます。

    メンバー

    • date
    • タイプ:string
    • Date オブジェクトが使用されます。注: それはデフォルトとして使用されます。モードが設定されると、submit でサーバーに送信される値は "toISOString" を使用した javascript Date オブジェクトの文字列値コンバーターです。
    • displayModeText
    • タイプ:string
    • String オブジェクトが使用され、「text」は表示モード (no focus) 形式 (pattern) です。
    • editModeText
    • タイプ:string
    • String オブジェクトが使用され、「text」は編集モード (focus) 形式 (pattern) です。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            dataMode: "editModeText"
        });
        
        //Get
        var dataMode = $(".selector").igDatePicker("option", "dataMode");
        
        //Set
        $(".selector").igDatePicker("option", "dataMode", "displayModeText");

  • dateDisplayFormat
    継承

    タイプ:
    string
    デフォルト:
    null

    エディターがフォーカスを持っていないときの日付書式を取得または設定します。
    このオプションの値は、指定した日パターンまたは地域設定で定義されたフラグに設定できます。
    値が設定されていない場合は、dateInputFormat が自動的に使用されます。
    値が明示的な日パターンに設定されていて、日フラグ以外のパターンに、日フラグまたはマスクフラグに一致する明示的な文字が含まれている場合は、それらの文字の前に "エスケープ" 文字を使用する必要があります。
    定義済みの地域フラグのリスト。
    "date": 地域オプションの datePattern メンバーを使用します。
    "dateLong": 地域オプションの dateLongPattern メンバーを使用します。
    "time": 地域オプションの timePattern メンバーを使用します。
    "timeLong": 地域オプションの timeLongPattern メンバーを使用します。
    "dateTime": 地域オプションの dateTimePattern メンバーを使用します。
    明示的な文字のリスト。これらの前にエスケープ \\ 文字が必要です。
    C、&、a、A、?、L、9、0、#、>、<、y、M、d、h、H、m、s、t、f。
    明示的な日パターンを使用するときの日フラグのリスト。
    "y": 世紀部分も先行するゼロもない年フィールド。
    "yy": 世紀部分がなく先行するゼロがある年フィールド。
    "yyyy": 先行するゼロがある年フィールド。
    "M": 先行するゼロがない数字で表す月フィールド。
    "MM": 先行するゼロがある数字で表す月フィールド。
    "MMM": 短い月名前で表す月フィールド。
    "MMMM": 長い月名前で表す月フィールド。
    "d": 先行するゼロがない月の中の日。
    "dd": 先行するゼロがある月の中の日。
    "ddd": 短い名前の曜日。
    "dddd": 長い名前の曜日。
    "t": AM/PM フィールドを表す文字列の最初の文字。
    "tt": AM/PM フィールドを表す 2 文字の文字列。
    "h": 先行するゼロがない 12 時間形式の時フィールド。
    "hh": 先行するゼロがある 12 時間形式の時フィールド。
    "H": 先行するゼロがない 24 時間形式の時フィールド。
    "HH": 先行するゼロがある 24 時間形式の時フィールド。
    "m": 先行するゼロがない分フィールド。
    "mm": 先行するゼロがある分フィールド。
    "s": 先行するゼロがない秒フィールド。
    "ss": 先行するゼロがある秒フィールド。
    "f": 100 分の 1 単位のミリ秒フィールド。
    "ff": 10 分の 1 単位のミリ秒フィールド。
    "fff": ミリ秒フィールド。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            dateDisplayFormat: "dateLong"
        });
        
        //Get
        var dateDisplayFormat = $(".selector").igDatePicker("option", "dateDisplayFormat");
        
        //Set
        $(".selector").igDatePicker("option", "dateDisplayFormat", "dateLong");

  • dateInputFormat
    継承

    タイプ:
    string
    デフォルト:
    null

    エディターがフォーカスを持っているときの日付書式を取得します。
    このオプションの値は、明示的な日パターンまたは地域設定で定義されたフラグに設定できます。
    値が明示的な日パターンに設定されていて、日フラグ以外のパターンに、日フラグまたはマスクフラグに一致する明示的な文字が含まれている場合は、それらの文字の前に "エスケープ" 文字を使用する必要があります。
    値が設定されていない場合は、"date" が自動的に使用されます。
    定義済みの地域フラグのリスト。
    "date": 地域オプションの datePattern メンバーを使用します。
    "dateLong": 地域オプションの dateLongPattern メンバーを使用します。
    "time": 地域オプションの timePattern メンバーを使用します。
    "timeLong": 地域オプションの timeLongPattern メンバーを使用します。
    "dateTime": 地域オプションの dateTimePattern メンバーを使用します。
    明示的な文字のリスト。これらの前にエスケープ \\ 文字が必要です: C、&、a、A、?、L、9、0、#、>、<、y、M、d、h、H、m、s、t、f。
    明示的な日パターンを使用するときの日フラグのリスト。
    "yy": 世紀部分がなく先行するゼロがある年フィールド。
    "yyyy": 先行するゼロがある年フィールド。
    "MM": 先行するゼロがある数字で表す月フィールド。
    "dd": 先行するゼロがある月の中の日。
    "t": AM/PM フィールドを表す文字列の最初の文字。
    "tt": AM/PM フィールドを表す 2 文字の文字列。
    "hh": 先行するゼロがある 12 時間形式の時フィールド。
    "HH": 先行するゼロがある 24 時間形式の時フィールド。
    "mm": 先行するゼロがある分フィールド。
    "ss": 先行するゼロがある秒フィールド。
    "f": 100 分の 1 単位のミリ秒フィールド。
    "ff": 10 分の 1 単位のミリ秒フィールド。
    "fff": ミリ秒フィールド。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            dateInputFormat : "dateLong"
        });
        
        //Get
        var dateInputFormat = $(".selector").igDatePicker("option", "dateInputFormat");
        
        //Set
        $(".selector").igDatePicker("option", "dateInputFormat", "dateLong");

  • datepickerOptions

    タイプ:
    object
    デフォルト:
    null

    jquery.ui.datepicker でサポートされるオプションを取得または設定します。ドロップダウン カレンダーに関連するオプションのみをサポートします。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            datepickerOptions: {minDate : new Date(2015, 9, 17), maxDate : new Date(2015, 9, 30) }
        });
        
        //Get
        var datepickerOptions = $(".selector").igDatePicker("option", "datepickerOptions");
        
        //Set
			$(".selector").igDatePicker("option", "datepickerOptions", {minDate : new Date(2017, 9, 11), maxDate : new Date(2017, 9, 22)});

  • disabled
    継承

    タイプ:
    bool
    デフォルト:
    false

    入力の disabled 属性を取得または設定します。True に設定される場合、入力が無効で、すべてのボタンおよび操作が無効です。エディターのフォームの送信で値が送信されません。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            disabled : true
        });
        
        //Get
        var disabled = $(".selector").igDatePicker("option", "disabled");
        
        //Set
        $(".selector").igDatePicker("option", "disabled", true);

  • dropDownOnReadOnly

    タイプ:
    bool
    デフォルト:
    false

    カレンダーのみとして igDatePicker を使用する機能を取得します。True に設定すると、エディターのテキストは編集できません。
    注: このオプションはランタイムで設定できません。

  • enableUTCDates
    継承

    タイプ:
    bool
    デフォルト:
    false

    UTC として日付の書式を取得または設定します。
    このオプションは、dataMode オプションがエディターの get/set 値に使用されるのが 'date' および Date オブジェクト場合のみサポートされます。
    注:
    オプションは get/set 値メソッドおよび初期化で設定された Date-value の機能のみに影響します。
    アプリケーションが set-value を使用する際に、内部 Date-value および displayed-text が TimezoneOffset によって増加されます。
    アプリケーションが get-value を使用する際に、TimezoneOffset によって減らされた内部 Date-value が返されます。
    そのオプションが初期化の後に変更される場合、表示されるテキストおよび内部の Date-value は影響されません。
    Date-value をリセットせずにそのオプションを変更しないでください。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            enableUTCDates : true
        });
 
        //Get
        var enableUTCDates = $(".selector").igDatePicker("option", "enableUTCDates");
 
        //Set
        $(".selector").igDatePicker("option", "enableUTCDates", true);

  • excludeKeys
    継承

    タイプ:
    string
    デフォルト:
    null

    キーボードの入力および貼り付けにより特定の文字の入力を回避する機能を取得または設定します。
    注:
    文字が includeKeys オプションに指定した場合、excludeKeys は優先があります。
    文字は大文字で設定する必要があります。
    オプションがランタイムに設定される場合、現在の値に適用されません。

    コード サンプル

     
        //Initialize
          $(".selector").igDatePicker({
              excludeKeys : "2, 4"
          });
 
          //Get
          var excludeKeys = $(".selector").igDatePicker("option", "excludeKeys");
 
          //Set
          $(".selector").igDatePicker("option", "excludeKeys", "2, 4");

  • height
    継承

    タイプ:
    enumeration
    デフォルト:
    null

    コントロールの高さを取得または設定します。

    メンバー

    • null
    • タイプ:object
    • 他の高さが定義されていない場合、エディターは親コンテナーに収まります。
    • string
    • 高さをピクセル (px) またはパーセンテージ (%) に設定できます。
    • number
    • 高さをピクセル単位の数値で設定できます。

    コード サンプル

     
      //Initialize
        $(".selector").igDatePicker({
            height : 25
        });
 
        //Get
        var height = $(".selector").igDatePicker("option", "height");
 
        //Set
        $(".selector").igDatePicker("option", "height", 25);

  • includeKeys
    継承

    タイプ:
    string
    デフォルト:
    null

    キーボードの入力および貼り付けにより入力フィールドで特定の文字のみを許可する機能を取得または設定します。
    注:
    "excludeKeys" オプションがこのオプションと同じ文字を含んでいる場合、"excludeKeys" が優先されます。
    文字は大文字で設定する必要があります。
    オプションがランタイムに設定される場合、現在の値に適用されません。

    コード サンプル

     
        //Initialize
          $(".selector").igDatePicker({
              includeKeys : "1, 3, 5, 7, 9"
          });
 
          //Get
          var includeKeys = $(".selector").igDatePicker("option", "includeKeys");
 
          //Set
          $(".selector").igDatePicker("option", "includeKeys", "1, 3, 5, 7, 9");

  • inputName
    継承

    タイプ:
    string
    デフォルト:
    null

    値入力の名前属性を取得または設定します。入力はサーバーへ値を送信するために使用されます。ターゲット要素が入力で名前要素があり、開発者が inputName オプションに設定した場合、このオプションは値入力を上書きし要素の属性を削除します。

    コード サンプル

     
        //Initialize 
        $(".selector").igDatePicker({     
            inputName : "textField"
        });  
 
        //Get 
        var inputName = $(".selector").igDatePicker("option", "inputName");  
 
        //Set 
        $(".selector").igDatePicker("option", "inputName", "textField");

  • limitSpinToCurrentField
    継承

    タイプ:
    bool
    デフォルト:
    false

    スピン イベントで日付の 1 フィールドを編集する機能を取得または設定します。
    値が False の場合、増加または減少させた日付フィールドが限界に達するとほかの日付フィールドが変化します。
    値が True の場合、1 つのフィールドの値のみを変更できます。

  • locale
    継承

    タイプ:
    object
    デフォルト:
    null

    コンポーネントのローカライズで使用される文字列を取得または設定します。ボタンのタイトル、エラー メッセージなどを含みます。オブジェクトの値がペアまたは key:value メンバーを含む必要があります。注:ロケールのサブオプションは igEditor のメイン オプションに表示されます。このケースではメインオプションの中の値は最優先でロケールに対応する値をオーバーライドします。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            locale : "th"
        });
 
        //Get
        var locale = $(".selector").igDatePicker("option", "locale");
 
        //Set
        $(".selector").igDatePicker("option", "locale", "th");

  • maxValue
    継承

    タイプ:
    date
    デフォルト:
    null

    ユーザーがエディターに入力できる最大値を取得または設定します。Date オブジェクトは値として設定できます。 文字列値を渡すと、エディターは日付オブジェクトを作成するために javascript Date オブジェクトのコンストラクターを使用し、結果のオブジェクトを比較で使用します。 MVC 日付書式も使用できます。
    注: このプロパティは、日付を抽出するために displayInputFormat 設定を使用しません。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            maxValue: new Date(2020, 11, 21)
        });
   
        //Get
        var maxValue = $(".selector").igDatePicker("option", "maxValue");

        //Set
        $(".selector").igDateEditor("option", "maxValue", new Date(2020, 11, 21));

  • minValue
    継承

    タイプ:
    date
    デフォルト:
    null

    ユーザーがエディターに入力できる最小値を取得または設定します。Date オブジェクトは値として設定できます。 文字列値を渡すと、エディターは日付オブジェクトを作成するために javascript Date オブジェクトのコンストラクターを使用し、結果のオブジェクトを比較で使用します。 MVC 日付書式も使用できます。
    注: このプロパティは、日付を抽出するために displayInputFormat 設定を使用しません。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            minValue: new Date(1980, 6, 1)
        });
   
        //Get
        var minValue = $(".selector").igDatePicker("option", "minValue");

        //Set
        $(".selector").igDateEditor("option", "minValue", new Date(1980, 6, 1));

  • nullValue
    継承

    タイプ:
    enumeration
    デフォルト:
    null

    エディター値が null 値になることが可能かどうかを取得または設定します。デフォルトの場合、入力の値は null に設定され、入力が空文字列を保持します。

  • placeHolder
    継承

    タイプ:
    string
    デフォルト:
    null

    エディターがフォーカスを持たず、エディター内の "value" が null または空の文字列ときのエディターに表示されるテキストを取得または設定します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            placeHolder: "Enter date"
        });
   
        //Get
        var placeHolder = $(".selector").igDatePicker("option", "placeHolder");
   
        //Set
        $(".selector").igDatePicker("option", "placeHolder", "Enter date");

  • preventSubmitOnEnter
    継承

    タイプ:
    bool
    デフォルト:
    false

    Enter キーの押下でフォーム送信を回避する機能を取得または設定します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            preventSubmitOnEnter: true
        });
   
        //Get
        var preventSubmitOnEnter = $(".selector").igDatePicker("option", "preventSubmitOnEnter");
   
        //Set
        $(".selector").igDatePicker("option", "preventSubmitOnEnter", true);

  • readOnly
    継承

    タイプ:
    bool
    デフォルト:
    false

    入力の readonly 属性を取得または設定します。True に設定される場合、入力が読み取り専用で、すべてのボタンおよび操作が無効です。エディターのフォームの送信で値が送信されます。

    コード サンプル

     
        `//Initialize
        $(".selector").igDatePicker({
            readOnly : true
        });
 
        //Get
        var readOnly = $(".selector").igDatePicker("option", "readOnly");
 
        //Set
        $(".selector").igDatePicker("option", "readOnly", true);

  • regional

    タイプ:
    object
    デフォルト:
    null

    エディターのカスタムの地域設定を取得または設定します。文字列の場合、$.ig.regional[stringValue] を仮定します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            regional: "en-US"
        });
 
        //Get
        var regional = $(".selector").igDatePicker("option", "regional");
 
        //Set
        $(".selector").igDatePicker("option", "regional", "en-US");

  • revertIfNotValid
    継承

    タイプ:
    bool
    デフォルト:
    true

    ぼかしまたは Enter キーの押しで値が無効な場合、エディターが値を以前の有効な値を元に戻す機能を取得または設定します。オプションが false に設定される場合、エディターはクリア機能を呼び出します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            revertIfNotValid : false
        });
 
        //Get
        var revertIfNotValid = $(".selector").igDatePicker("option", "revertIfNotValid");
 
        //Set
        $(".selector").igDatePicker("option", "revertIfNotValid", false);

  • selectionOnFocus
    継承

    タイプ:
    enumeration
    デフォルト:
    selectAll

    エディターがフォーカスを取得したときの動作を取得または設定します。デフォルト値は selectAll です。

    メンバー

    • selectAll
    • タイプ:string
    • このオプションを設定すると、編集モードに入ったときにエディターのすべてのテキストを選択します。
    • atStart
    • タイプ:string
    • このオプションを設定すると、編集モードに入ったときにエディターのテキストの初めにカーソルを移動します。
    • atEnd
    • タイプ:string
    • このオプションを設定すると、編集モードに入ったときにエディターのテキストの最後にカーソルを移動します。
    • browserDefault
    • タイプ:string
    • このオプションの設定に追加のロジックはありませんが、ブラウザーのデフォルトの動作で処理されます。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            selectionOnFocus: "atStart"
        });
 
        //Get
        var selectionOnFocus= $(".selector").igDatePicker("option", "selectionOnFocus");
 
        //Set
        $(".selector").igDatePicker("option", "selectionOnFocus", "atStart");

  • spinDelta
    継承

    タイプ:
    number
    デフォルト:
    1

    スピン イベント発生時にエディター内の値の増減に使用するデルタ値を取得および設定します。値が負の数に設定される場合、例外は発生されます。整数値以外の値は double および float の dataMode のみにサポートされます。

  • spinWrapAround
    継承

    タイプ:
    bool
    デフォルト:
    false

    ホバー項目を開いたドロップダウン リストからその反対側へ自動的に変更する機能を取得または設定します。最後の項目に達してスピン ダウンがクリックされると、最初の項目がホバーされます (逆の場合も同じ) 。

  • suppressNotifications
    継承

    タイプ:
    bool
    デフォルト:
    false

    エディターのビルトイン基本検証シナリオで、必須リスト選択、値ラッピング、スピン制限などのデフォルトの通知を有効/無効にします。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            suppressNotifications : true
        });
 
        //Get
        var suppressNotifications = $(".selector").igDatePicker("option", "suppressNotifications");
 
        //Set
        $(".selector").igDatePicker("option", "suppressNotifications", true);

  • tabIndex
    継承

    タイプ:
    number
    デフォルト:
    null

    エディター入力の tabIndex 属性を取得または設定します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            tabIndex : 3
        });
 
        //Get
        var tabIndex = $(".selector").igDatePicker("option", "tabIndex");
 
        //Set
        $(".selector").igDatePicker("option", "tabIndex", 3);

  • textAlign
    継承

    タイプ:
    enumeration
    デフォルト:
    left

    エディター内のテキストの水平配置を取得または設定します。そのオプションが設定されない場合、'numeric'、'currency'、および 'percent' エディターの 'right' のデフォルト値が使用されます。

    メンバー

    • left
    • タイプ:string
    • 入力したテキストは左揃えになります。
    • right
    • タイプ:string
    • 入力したテキストは右揃えになります。
    • center
    • タイプ:string
    • 入力したテキストは中央揃えになります。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            textAlign : "center"
        });
 
        //Get
        var textAlign = $(".selector").igDatePicker("option", "textAlign");
 
        //Set
        $(".selector").igDatePicker("option", "textAlign", "center");

  • textMode
    継承

    タイプ:
    enumeration
    デフォルト:
    text

    単一行テキスト エディター、パスワード エディター、複数行エディターなど、エディターのテキスト モードを取得または設定します。このオプションは、初期化時にのみ影響します。ベースとなる要素 (セレクター) が TEXTAREA の場合、それを入力フィールドとして使用します。

    メンバー

    • text
    • タイプ:string
    • INPUT 要素に基づく単一行テキスト エディターが作成されます。
    • password
    • タイプ:string
    • タイプ パスワードで作成される INPUT 要素に基づくエディターが作成されます。
    • multiline
    • タイプ:string
    • TEXTAREA 要素に基づく複数行エディターが作成されます。

  • validatorOptions
    継承

    タイプ:
    object
    デフォルト:
    null

    igValidator ウィジェットによってサポートされるオプションを取得または設定します。
    注: エラーをトリガーした際に igValidator の検証ルールは最小値/長さおよび最大値/長さを別々に適用します。エディターの対応するオプションは、定義された入力規則に反する値の入力を防止します。

    コード サンプル

     
        /Initialize
      $(".selector").igDatePicker({
          validatorOptions : {
              onblur: true,         
              errorMessage: "Error!"
          }
      });
 
      //Get
      var validatorOptions = $(".selector").igDatePicker("option", "validatorOptions");
 
      //Set
      $(".selector").igDatePicker("option", "validatorOptions", {onblur: true, errorMessage: "Error!"});

  • value
    継承

    タイプ:
    date
    デフォルト:
    null

    エディター内の値を取得または設定します。Date オブジェクトは値として設定できます。 文字列値を渡すと、エディターは日付オブジェクトを作成するために javascript Date オブジェクトのコンストラクターを使用し、結果のオブジェクトを値として使用します。 MVC 日付書式も使用できます。 たとえば、Date(/"thicks"/) です。
    注: このプロパティは、日付を抽出するために displayInputFormat 設定を使用しません。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            value : new Date (2015, 11, 11)
        });
 
        //Get
        var value = $(".selector").igDatePicker("option", "value");
 
        //Set
        $(".selector").igDatePicker("option", "value", new Date (2015, 11, 11));

  • width
    継承

    タイプ:
    enumeration
    デフォルト:
    null

    コントロールの幅を取得または設定します。

    メンバー

    • null
    • タイプ:object
    • 他の幅が定義されていない場合、データに合わせて引き伸ばされます。
    • string
    • ウィジェットの幅をピクセル (px) またはパーセンテージ (%) に設定できます。
    • number
    • ウィジェットの幅は数値としてピクセルで設定できます。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            width : 200
        });
 
        //Get
        var width = $(".selector").igDatePicker("option", "width");
 
        //Set
        $(".selector").igDatePicker("option", "width", 200);

  • yearShift
    継承

    タイプ:
    number
    デフォルト:
    0

    グレゴリオ暦での年と表示されている年の差異を取得または設定します。

    コード サンプル

     
        //Initialize
        $(".selector").igDatePicker({
            yearShift : 4500
        });
 
        //Get
        var yearShift = $(".selector").igDatePicker("option", "yearShift");
 
        //Set
        $(".selector").igDatePicker("option", "yearShift", 4500);

Ignite UI コントロール イベントの詳細については、
Ignite UI でイベントを使用するを参照してください。

注: API メソッドの呼び出しは、API ヘルプに特に記述がない限り、操作に関連するイベントはプログラムによって発生されません。これらのイベントは各ユーザー操作によってのみ呼び出されます。

詳細の表示

  • blur
    継承

    キャンセル可能:
    false

    エディターの入力フィールドがフォーカスを失ったとき発生するイベント。
    関数は引数 evt を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickerblur", function (evt) {
            //return browser event
            evt.originalEvent;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            blur: function (evt) { ... }
        });

  • dropDownListClosed

    キャンセル可能:
    false

    ドロップダウン (カレンダー) がすでに閉じているときに発生するイベント。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.editorInput を使用して、編集可能な入力への参照を取得します。
    ui.calendar を使用して、igDatePicker のカレンダーとして使用される jQuery UI 日付ピッカー ウィジェットへの参照を取得します。

  • dropDownListOpened

    キャンセル可能:
    false

    ドロップダウン リストがすでに開いているときに発生するイベント。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.editorInput を使用して、編集可能な入力への参照を取得します。
    ui.calendar を使用して、igDatePicker のカレンダーとして使用される jQuery UI 日付ピッカー ウィジェットへの参照を取得します。

  • dropDownListOpening

    キャンセル可能:
    true

    ドロップダウン リストが開いているときに発生するイベント。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.editorInput を使用して、編集可能な入力への参照を取得します。
    ui.calendar を使用して、igDatePicker のカレンダーとして使用される jQuery UI 日付ピッカー ウィジェットへの参照を取得します。

  • focus
    継承

    キャンセル可能:
    false

    エディターの入力フィールドがフォーカスを取得したとき発生するイベント。
    関数は引数 evt を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickerfocus", function (evt) {
            //return browser event
            evt.originalEvent;
        });
   
        //Initialize
        $(".selector").igDatePicker({
            focus: function (evt) { ... }
        });

  • itemSelected

    キャンセル可能:
    false

    カレンダーの日付選択の後に発生されるイベント。
    関数は引数 ui を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    ui.dateFromPicker を使用して、選択された日付オブジェクトへの参照を取得します。
    ui.item を使用して、カレンダーから選択した html 要素への参照を取得します。
    ui.calendar を使用して、igDatePicker のカレンダーとして使用される jQuery UI 日付の選択への参照を取得します。

    コード サンプル

    							//  Bind
				$(document).delegate(".selector", "igdatepickeritemselected", function (ui) {
						//return reference to the widget
						ui.owner;
						//Obtain reference to the date object which is selected
						ui.dateFromPicker 
						//Obtain a referece to the selected html element from the calendar
						ui.item
						//Obtain a reference to jQuery UI date picker, used as a calendar from the igDatePicker.
						ui.calendar
				});
	 
				//Initialize
				$(".selector").igDatePicker({
						itemSelected: function (ui) { ... }
				});

  • keydown
    継承

    キャンセル可能:
    true

    keydown イベントに対して発生するイベント。
    キー操作をキャンセルするには、False を返します。
    関数は引数 evt および ui を受け取ります。
    evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    ui.key を使用して keyCode の値を取得します。

    コード サンプル

     
         //  Bind
        $(document).delegate(".selector", "igdatepickerkeydown", function (evt, ui) {
            //return browser event
            evt.originalEvent;
            //use to obtain value of keyCode
            ui.key;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            keydown: function (evt, ui) { ... }
        });

  • keypress
    継承

    キャンセル可能:
    true

    keypress イベントに対して発生するイベント。
    キー操作をキャンセルするには、False を返します。
    関数は引数 evt および ui を受け取ります。
    evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    ui.key を使用して keyCode の値を取得します。
    ui.key を元のエントリを置き換える別の文字に設定します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickerkeypress", function (evt, ui) {
            //return browser event
            evt.originalEvent;              
            //use to obtain value of keyCode
            ui.key;
            //set the ui.key to "1" - a cahracter which will replace the original entry
            ui.key = 49
        });
 
        //Initialize
        $(".selector").igDatePicker({
            keypress: function (evt, ui) { ... }
        });

  • keyup
    継承

    キャンセル可能:
    false

    keyup イベントに対して発生するイベント。
    関数は引数 evt および ui を受け取ります。
    evt.originalEvent を使用して、ブラウザーのイベントへの参照を取得します。
    ui.owner を使用して igEditor への参照を取得します。
    ui.key を使用して keyCode の値を取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickerkeyup", function (evt, ui) {
            //return browser event
            evt.originalEvent;
            //use to obtain value of keyCode
            ui.key;
 
        });
 
        //Initialize
        $(".selector").igDatePicker({
            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 要素を表すフラグを取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickermousedown", function (evt, ui) {
            //obtains type of html element under mouse, such as field, button, spinUpper or spinLower.
            ui.elementType;
 
            //obtains id of html element under mouse, such as field, button, spinUpper or spinLower.
            ui.id;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            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 要素を表すフラグを取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickermousemove", function (evt, ui) {
            //obtains type of html element under mouse, such as field, button, spinUpper or spinLower.
            ui.elementType;
 
            //obtains id of html element under mouse, such as field, button, spinUpper or spinLower.
            ui.id;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            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 要素を表すフラグを取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickermouseout", function (evt, ui) {
            //return browser event
            evt.originalEvent;              
            //obtains type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
            ui.elementType;
 
            //obtains id of html element under mouse, such as field, button, spinUpper, spinLower or item#.
            ui.id;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            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 要素を表すフラグを取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickermouseover", function (evt, ui) {
          //return browser event
          evt.originalEvent;              
          //obtains type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
          ui.elementType;
 
          //obtains id of html element under mouse, such as field, button, spinUpper, spinLower or item#.
          ui.id;
      });
 
      //Initialize
      $(".selector").igDatePicker({
          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 要素を表すフラグを取得します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickermouseup", function (evt, ui) {
            //obtains type of html element under mouse, such as field, button, spinUpper оr spinLower.
            ui.elementType;
 
            //obtains id of html element under mouse, such as field, button, spinUpper or spinLower.
            ui.id;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            mouseup: function (evt, ui) { ... }
        });

  • rendered
    継承

    キャンセル可能:
    false

    エディターの描画が完了した後に発生するイベント。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して、レンダリングを実行するエディターへの参照を取得します。
    ui.element を使用して、エディター要素への参照を取得します。

    コード サンプル

     
        $(document).delegate(".selector", "igdatepickerrendered", function (evt, ui) {
          
        });

        //Initialize
        $(".selector").igDatePicker({
            rendered: function () {
            ...
            }
          });

  • rendering
    継承

    キャンセル可能:
    false

    エディターの描画が完了する前に発生するイベント。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して、レンダリングを実行するエディターへの参照を取得します。
    ui.element を使用して、エディター要素への参照を取得します。

    コード サンプル

     
        $(document).delegate(".selector", "igdatepickerrendering", function (evt, ui) {
          
        });

        //Initialize
        $(".selector").igDatePicker({
            rendering: function () {
            ...
            }
          });

  • textChanged
    継承

    キャンセル可能:
    false

    エディター内のテキストが変更された後に発生するイベント。keyUp イベントが発生するときに発生できます。
    または、クリアボタンがクリックされたときまたはリストの項目がせんたくされたときに発生できます。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.text を使用して、新しいテキストを取得します。
    古いテキストの取得に ui.oldText を使用します。

    コード サンプル

     
        //  Bind
        $(document).delegate(".selector", "igdatepickertextchanged", function (evt, ui) {
            //gets the new value
            ui.value;
            //gets the old value
            ui.oldValue;
        });
 
        //Initialize
        $(".selector").igDatePicker({
            textChanged: function (evt, ui) { ... }
        });

  • valueChanged
    継承

    キャンセル可能:
    false

    エディター内の値が変更された後に発生するイベント。フォーカスの消失またはスピン イベントに対して発生します。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.newValue を使用して新しい値を取得します。
    ui.originalValue を使用して、元の値を取得します。
    ui.editorInput を使用して、エディター入力への参照を取得します。

    コード サンプル

     
        $(document).delegate(".selector", "igdatepickervaluechanged", function (evt, ui) {

						//Use to obtain reference to igEditor
						ui.owner;
						//Use to obtain new value
						ui.newValue;
						//Use to obtain the value coming from the native event arguments
						ui.originalValue;
						//Use to obtain reference to editor input
						ui.editorInput
        });

        //Initialize
        $(".selector").igDatePicker({
            valueChanged: function (evt, ui) {
            ...
            }
        });

  • valueChanging
    継承

    キャンセル可能:
    true

    エディター内の値が変更される前に発生するイベント。
    変更をキャンセルするには、False を返します。
    フォーカスの消失またはスピン イベントに対して発生します。
    関数は引数 evt および ui を受け取ります。
    ui.owner を使用して igEditor への参照を取得します。
    ui.newValue を使用して新しい値を取得します。
    ui.originalValue を使用して、元の値を取得します。
    ui.editorInput を使用して、エディター入力への参照を取得します。

    コード サンプル

     
        $(document).delegate(".selector", "igdatepickervaluechanging", function (evt, ui) {

						//Use to obtain reference to igEditor
						ui.owner;
						//Use to obtain new value
						ui.newValue;
						//Use to obtain old value
						ui.oldValue;
						//Use to obtain reference to editor input
						ui.editorInput
        });

        //Initialize
        $(".selector").igDatePicker({
            valueChanging: function (evt, ui) {
            ...
            }
        });

  • clearButton
    継承

    .igDatePicker( "clearButton" );

    エディターのクリア ボタン UI 要素への参照を返します。
    returnType="$"。jquery オブジェクトへの参照を返します。

    コード サンプル

     
        $(".selector").igDatePicker("clearButton");

  • destroy

    .igDatePicker( "destroy" );

    ウィジェットを破棄します。

    コード サンプル

     
        $(".selector").igDatePicker("destroy");

  • displayValue
    継承

    .igDatePicker( "displayValue" );
    返却型:
    string
    返却型の説明:
    エディターの表示テキスト。

    エディターに表示するテキストを取得します。

    コード サンプル

     
        $(".selector").igDatePicker("displayValue");

  • dropDownButton

    .igDatePicker( "dropDownButton" );

    エディターのカレンダー ボタン UI 要素への参照を返します。
    returnType="$"。jquery オブジェクトへの参照を返します。

    コード サンプル

     
				var button = $(".selector").igDatePicker("dropDownButton");

  • dropDownVisible

    .igDatePicker( "dropDownVisible" );
    返却型:
    bool
    返却型の説明:
    カレンダーの表示状態。

    カレンダーの表示状態を返します。

    コード サンプル

    				$(".selector").igDatePicker("dropDownVisible");

  • editorContainer
    継承

    .igDatePicker( "editorContainer" );
    返却型:
    object
    返却型の説明:
    コンテナー エディター要素。

    エディターをラップする jQuery 要素への参照を取得します。

    コード サンプル

     
        $(".selector").igDatePicker("editorContainer");

  • field
    継承

    .igDatePicker( "field" );

    エディターの入力要素を取得します。
    returnType="$" 視覚エディター要素。

    コード サンプル

             $(".selector").igDatePicker("field");

  • getCalendar

    .igDatePicker( "getCalendar" );

    ピッカー セレクターとして使用される jQuery カレンダーへの参照を返します。
    returnType="$"。jquery オブジェクトへの参照を返します。

    コード サンプル

     
        $(".selector").igDatePicker("getCalendar");

  • getSelectedDate
    継承

    .igDatePicker( "getSelectedDate" );
    返却型:
    date

    選択された日付を取得します。

    コード サンプル

     
        $(".selector").igDatePicker("getSelectedDate");

  • getSelectedText
    継承

    .igDatePicker( "getSelectedText" );
    返却型:
    string
    返却型の説明:
    エディターで選択されたテキスト。

    編集モードでエディターから選択されたテキストを取得します。このメソッドは、keydown または keyup などのキー イベントでエディターにフォーカスがある場合のみ使用できます。このメソッドをエディターにフォーカスがない状態で呼び出した場合、空文字列になる場合があります。

    コード サンプル

     
        $(".selector").igDatePicker("getSelectedText");

  • getSelectionEnd
    継承

    .igDatePicker( "getSelectionEnd" );
    返却型:
    number
    返却型の説明:
    エディターで選択されたテキストの終了インデックス。

    エディターで選択されたテキストの終了インデックスを取得します。

    コード サンプル

     
        $(".selector").igDatePicker("getSelectionEnd");

  • getSelectionStart
    継承

    .igDatePicker( "getSelectionStart" );
    返却型:
    number
    返却型の説明:
    エディターで選択されたテキストの開始インデックス。

    エディターで選択されたテキストの開始インデックスを取得します。

    コード サンプル

     
        $(".selector").igDatePicker("getSelectionStart");

  • hasFocus
    継承

    .igDatePicker( "hasFocus" );
    返却型:
    bool
    返却型の説明:
    エディターがフォーカスされるかどうかを返します。

    エディターがフォーカスを持つかどうかを取得します。

    コード サンプル

     
        $(".selector").igDatePicker("hasFocus");

  • hide
    継承

    .igDatePicker( "hide" );

    エディターを非表示にします。

    コード サンプル

     
        $(".selector").igDatePicker("hide");

  • hideDropDown

    .igDatePicker( "hideDropDown" );

    ドロップダウン リストを非表示します。

    コード サンプル

     
				$(".selector").igDatePicker("hideDropDown");

  • inputName
    継承

    .igDatePicker( "inputName", [newValue:string] );
    返却型:
    string
    返却型の説明:
    現在の入力名。

    エディター要素に適用される名前属性を取得または設定します。

    • newValue
    • タイプ:string
    • オプション
    • 新しい入力名。

    コード サンプル

     
        $(".selector").igDatePicker("inputName");

  • insert
    継承

    .igDatePicker( "insert", string:string );

    カレットの位置、または現在選択を上書きしてテキストを挿入します。エディターがフォーカスを持つ場合、このメソッドは現在選択を上書きしてテキストを挿入します。エディターがフォーカスを持たない場合、このメソッドはエディターの値をテキストに設定します。注: メソッドは textChanged イベントを発生させます。

    • string
    • タイプ:string
    • 挿入する文字列。

    コード サンプル

     
        $(".selector").igDatePicker("insert", "20");

  • isValid
    継承

    .igDatePicker( "isValid" );
    返却型:
    bool
    返却型の説明:
    編集値が有効化どうか。

    エディター内の値が値かどうかチェックします。注: この機能は自動通知をトリガーしません。

    コード サンプル

     
        $(".selector").igDatePicker("isValid");

  • select
    継承

    .igDatePicker( "select", start:number, end:number );

    エディターで開始インデックスおよび終了インデックスの間のテキストを選択します。パラメーターが等しい場合、このメソッドはカレットの場所を設定します。このメソッドはエディターにフォーカスがある場合のみ効果があります。

    • start
    • タイプ:number
    • 選択の開始。
    • end
    • タイプ:number
    • 選択の終了。

    コード サンプル

     
        $(".selector").igDatePicker("select", 2, 4);

  • selectDate
    継承

    .igDatePicker( "selectDate", date:date );

    選択された日付を設定します。

    • date
    • タイプ:date
    • .

    コード サンプル

     
        $(".selector").igDatePicker("selectDate", new Date (2016, 2, 3));

  • setFocus
    継承

    .igDatePicker( "setFocus", [delay:number] );

    指定した遅延時間の後にフォーカスをエディターに設定します。

    • delay
    • タイプ:number
    • オプション
    • エディターにフォーカスする前の遅延。

    コード サンプル

     
        $(".selector").igDatePicker("setFocus", 350);

  • show
    継承

    .igDatePicker( "show" );

    エディターを表示します。

    コード サンプル

     
        $(".selector").igDatePicker("show");

  • showDropDown

    .igDatePicker( "showDropDown" );

    ドロップダウン リストを表示します。

  • spinDown
    継承

    .igDatePicker( "spinDown", [delta:number] );

    カーソル位置に基づいて日時期間を減らします。

    • delta
    • タイプ:number
    • オプション
    • 減少デルタ。

    コード サンプル

     
        $(".selector").igDatePicker("spinDown", 2);

  • spinDownButton
    継承

    .igDatePicker( "spinDownButton" );

    エディターのスピン ダウン UI 要素への参照を返します。
    returnType="$" エディターのスピン ダウン UI 要素を表す jQuery オブジェクト。

    コード サンプル

     
				var button = $(".selector").igDatePicker("spinUpButton");

  • spinUp
    継承

    .igDatePicker( "spinUp", [delta:number] );

    カーソル位置に基づいて日時期間を増加します。

    • delta
    • タイプ:number
    • オプション
    • 増加デルタ。

    コード サンプル

     
        $(".selector").igDatePicker("spinUp", 5);

  • spinUpButton
    継承

    .igDatePicker( "spinUpButton" );

    エディターのスピン アップ UI 要素への参照を返します。
    returnType="$" エディターのスピン アップ UI 要素を表す jQuery オブジェクト。

    コード サンプル

     
				var button = $(".selector").igDatePicker("spinUpButton");

  • validate
    継承

    .igDatePicker( "validate" );
    返却型:
    bool
    返却型の説明:
    編集値が有効化どうか。

    エディターの検証をトリガーします。 validatorOptions を設定すると igValidator で検証も呼び出されます。

    コード サンプル

     
        $(".selector").igDatePicker("validate");

  • validator
    継承

    .igDatePicker( "validator" );
    返却型:
    object
    返却型の説明:
    igValidator への参照または null を返します。

    エディターで使用される igValidator への参照を取得します。

    コード サンプル

     
        $(".selector").igDatePicker("validator");

  • value
    継承

    .igDatePicker( "value", [newValue:date] );
    返却型:
    date
    返却型の説明:
    現在のエディター値。

    エディター値を取得または設定します。
    注: このプロパティは、日付を抽出するために displayInputFormat 設定を使用しません。

    • newValue
    • タイプ:date
    • オプション
    • 新しいエディターの値。Date オブジェクトは値として設定できます。 文字列値を渡すと、エディターは日付オブジェクトを作成するために javascript Date オブジェクトのコンストラクターを使用し、結果のオブジェクトを比較で使用します。 MVC 日付書式も使用できます。 たとえば、Date(/"thicks"/) です。

    コード サンプル

     
        $(".selector").igDatePicker("value", new Date (2016, 2, 3);

  • 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 ui-icon

    クリア ボタン画像を保持する 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 要素に適用されるクラス。

Copyright © 1996 - 2024 Infragistics, Inc. All rights reserved.