ui.igNumericEditor

ui.igNumericEditor_image

The igNumericEditor control accepts a wide array of numeric input. You can optionally choose to make spin buttons available on the editor. Further information regarding the classes, options, events, methods and themes of this API are available under the associated tabs above.

For more igNumericEditor API details, refer to the igEditor API documentation.

The following code snippet demonstrates how to initialize the igNumericEditor control.

Click here for more information on how to get started using this API. For details on how to reference the required scripts and themes for the igNumericEditor control read, Using JavaScript Resources in Ignite UI and Styling and Theming Ignite UI.

Code Sample

   <!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 () {
                $("#numericEditor").igNumericEditor({
                    dataMode: "int",
                    maxValue: 100,
                    minValue: 0,
                    buttonType: "spin",
                    width: 190
                });
            });
          </script>
      </head>
      <body>
         <input id="numericEditor" />
      </body>
      </html>

Related Samples

Related Topics

Dependencies

jquery-1.9.1.js
jquery.ui-1.9.0.js
infragistics.util.js
infragistics.ui.popover.js
infragistics.ui.notifier.js

Inherits

  • allowNullValue

    Type:
    bool
    Default:
    false

    Gets/Sets ability to prevent null value.
    If that option is disabled, and editor has no value, then value is set to 0 (or minValue/maxValue).

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            allowNullValue : false
        });

        //Get
        var allowNullValue = $(".selector").igNumericEditor("option", "allowNullValue");

        //Set
        $(".selector").igNumericEditor("option", "allowNullValue", false);

  • buttonType
    Inherited

    Type:
    enumeration
    Default:
    none

    Gets visibility of spin and drop-down button. That option can be set only on initialization. Combinations like 'dropdown,spin' or 'spinclear' are supported too. Note! This option can not be set runtime.

    Members

    • dropdown
    • Type:string
    • button to open list is located on the right side of input-field (or left side if base html element has direction:rtl);.
    • clear
    • Type:string
    • button to clear value is located on the right side of input-field (or left side if base html element has direction:rtl);.
    • spin
    • Type:string
    • spin buttons are located on the right side of input-field (or left side if base html element has direction:rtl).

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            buttonType : "dropdown"
        });

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

        //Set
        $(".selector").igNumericEditor("option", "buttonType", "spin");

  • dataMode

    Type:
    enumeration
    Default:
    double

    Gets type of value returned by the get of value() method. That also affects functionality of the set value(val) method and the copy/paste operations of browser.

    Members

    • double
    • Type:string
    • the Number object is used with limits of double and if value is not set, then the null or Number.NaN is used depending on the option 'nullable'. Note: that is used as default.
    • float
    • Type:string
    • the Number object is used with limits of float and if value is not set, then the null or Number.NaN is used depending on the option 'nullable'.
    • long
    • Type:string
    • the Number object is used with limits of signed long and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • ulong
    • Type:string
    • the Number object is used with limits of unsigned long and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • int
    • Type:string
    • the Number object is used with limits of signed int and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • uint
    • Type:string
    • the Number object is used with limits of unsigned int and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • short
    • Type:string
    • the Number object is used with limits of signed short and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • ushort
    • Type:string
    • the Number object is used with limits of unsigned short and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • sbyte
    • Type:string
    • the Number object is used with limits of signed byte and if value is not set, then the null or 0 is used depending on the option 'nullable'.
    • byte
    • Type:string
    • the Number object is used with limits of unsigned byte and if value is not set, then the null or 0 is used depending on the option 'nullable'.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            dataMode : "int"
        });
        
        //Get
        var dataMode = $(".selector").igNumericEditor("option", "dataMode");
        
        //Set
        $(".selector").igNumericEditor("option", "dataMode", "float");

  • decimalSeparator

    Type:
    string
    Default:
    null

    Gets the character, which is used as decimal separator.
    Note: this option has priority over possible regional settings.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            decimalSeparator : ","
        });
        
        //Get
        var separator = $(".selector").igNumericEditor("option", "decimalSeparator");
        
        //Set
        $(".selector").igNumericEditor("option", "decimalSeparator", ",");

  • disabled
    Inherited

    Type:
    bool
    Default:
    false

    Gets/Sets the disabled attribute.Does not allow editing. Disables all the buttons and iteracitons applied. On submit the current value is not sent into the request.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            disabled : false
        });

        //Get
        var disabled = $(".selector").igNumericEditor("option", "disabled");

        //Set
        $(".selector").igNumericEditor("option", "disabled", true);

  • dropDownAnimationDuration
    Inherited

    Type:
    number
    Default:
    300

    Gets/Sets show/hide drop-down list animation duration in milliseconds.

    Code Sample

            //Initialize
        $(".selector").igNumericEditor({
          dropDownAnimationDuration: 500
        });
 
        //Get
        var animationShowDuration= $(".selector").igNumericEditor("option", "dropDownAnimationDuration");
 
        //Set
        $(".selector").igNumericEditor("option", "dropDownAnimationDuration", 500);

  • dropDownAttachedToBody
    Inherited

    Type:
    bool
    Default:
    false

    Gets location of drop-down list.
    Value false will create html element for list as a child of main html element.
    Value true creates list as a child of body.
    Note! This option can not be set runtime.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            dropDownAttachedToBody : true
        });

        //Get
        var attachedToBody = $(".selector").igNumericEditor("option", "dropDownAttachedToBody");

        //Set
        $(".selector").igNumericEditor("option", "dropDownAttachedToBody", true);

  • dropDownOnReadOnly
    Inherited

    Type:
    bool
    Default:
    false

    Gets ability to limit editor to be used only from the dropdown list. When set to true the editor input is not editable.
    Note! In case there are no list items - the editor will reamin readonly
    Note! This option can not be set runtime.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            dropDownOnReadOnly : true
        });

        //Get
        var readOnly = $(".selector").igNumericEditor("option", "dropDownOnReadOnly");

        //Set
        $(".selector").igNumericEditor("option", "dropDownOnReadOnly", true);

  • dropDownOrientation
    Inherited

    Type:
    enumeration
    Default:
    auto

    Gets/Sets drop down opening orientation for the dorp down list when open button is clicked. If auto option is set the component calculates if there is enough space at the bottom, if not checks the space above the component and if in both directions there is not enough space it openes the dropdown down way.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            dropDownOrientation : "top"
        });

        //Get
        var orientation = $(".selector").igNumericEditor("option", "dropDownOrientation");

        //Set
        $(".selector").igNumericEditor("option", "dropDownOrientation", "bottom");

  • groups

    Type:
    array
    Default:
    null
    Elements Type:

    (array of number objects) Gets the number of digits in integer part of number, which are divided into groups.
    The "groupSeparator" is inserted between groups.
    If the sum of all values in array is smaller than the length of integer part, then the last item in array is used for all following groups.
    Count of groups starts from the decimal point (from right to left).
    That option has effect only in display mode(no focus).
    Note: this option has priority over possible regional settings.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            groups : [1, 2, 3],
        });

        //Get
        var groups = $(".selector").igNumericEditor("option", "groups");

        //Set
        $(".selector").igNumericEditor("option", "groups", [3, 3, 3]);

  • groupSeparator

    Type:
    string
    Default:
    null

    Gets/Sets the character, which is used as separator for groups (like thousands).
    That option has effect only in display mode(no focus).
    Note: this option has priority over possible regional settings.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            groupSeparator : ".",
        });

        //Get
        var groupSeparator = $(".selector").igNumericEditor("option", "groupSeparator");

        //Set
        $(".selector").igNumericEditor("option", "groupSeparator", ".");

  • height
    Inherited

    Type:
    enumeration
    Default:
    null

    Gets/Sets how the height of the control can be set.

    Members

    • null
    • Type:object
    • will fit the editor inside its parent container, if no other heights are defined.
    • string
    • The height can be set in pixels (px) and percentage (%).
    • number
    • The height can be set as a number in pixels.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            height : 25
        });

        //Get
        var height = $(".selector").igNumericEditor("option", "height");

        //Set
        $(".selector").igNumericEditor("option", "height", 25);

  • inputName
    Inherited

    Type:
    string
    Default:
    null

    Sets the name attribute of the value input. This input is used to sent the value to the server. In case the target element is input and it has name attribute, but the developer has set the inputName option, so this option overwrites the value input and removes the attribute from the element.

    Code Sample

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

  • isLimitedToListValues
    Inherited

    Type:
    bool
    Default:
    false

    Sets the ability to allow values only set into the list items. This validation is done only when the editor is blured, or enter key is pressed.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            isLimitedToListValues : true
        });

        //Get
        var limited = $(".selector").igNumericEditor("option", "isLimitedToListValues");

        //Set
        $(".selector").igNumericEditor("option", "isLimitedToListValues", false);

  • listItemHoverDuration
    Inherited

    Type:
    number
    Default:
    0

    Sets the hover/unhover animation duration.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            listItemHoverDuration : 100
        });

        //Get
        var hoverDuration = $(".selector").igNumericEditor("option", "listItemHoverDuration");

        //Set
        $(".selector").igNumericEditor("option", "listItemHoverDuration", 100);

  • listItems
    Inherited

    Type:
    array
    Default:
    null
    Elements Type:

    Gets/Sets list of items which are used for drop-down list.
    Items in list can be strings, numbers or objects. The items are directly rendered without casting, or manipulating them.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            listItems : [
                10,
                20,
                30
            ]
        });

        //Get
        var items = $(".selector").igNumericEditor("option", "listItems");

        //Set
        $(".selector").igNumericEditor("option", "listItems", [10, 20, 30]);

  • listWidth
    Inherited

    Type:
    number
    Default:
    0

    Gets/Sets custom width of drop-down list in pixels. If value is equal to 0 or negative, then the width of editor is used.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            listWidth : 200
        });

        //Get
        var width = $(".selector").igNumericEditor("option", "listWidth");

        //Set
        $(".selector").igNumericEditor("option", "listWidth", 200);

  • locale
    Inherited

    Type:
    object
    Default:
    null

    Gets/Sets strings used for title of buttons. Value of object should contain pairs or key:value members. Note: any sub-option of locale can appear within the main option of igEditor. In this case those values within main options will have highest priority and override corresponding value in locale.

    Code Sample

     
        //Initialize
        $(".selector").igTextEditor({
            locale: {
			        spinUpperTitle: 'SpinUp'
            }
        });

        //Get
        var locale = $(".selector").igTextEditor("option", "locale");

        //Set
        $(".selector").igTextEditor("option", "locale", {spinUpperTitle: 'SpinUp'});

  • maxDecimals

    Type:
    number
    Default:
    null

    Gets the maximum number of decimal places which are used in display mode(no focus).
    Note: this option has priority over possible regional settings.
    Note: In case of min decimals value higher than max decimals - max decimals are equaled to min decimals property.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            maxDecimals: 10,
        });

        //Get
        var maxDecimals = $(".selector").igNumericEditor("option", "maxDecimals");

        //Set
        $(".selector").igNumericEditor("option", "maxDecimals", 5);

  • maxValue

    Type:
    number
    Default:
    null

    Gets/Sets the maximum value which can be entered in editor by end user.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            maxValue : 100
        });

        //Get
        var maxValue = $(".selector").igNumericEditor("option", "maxValue");

        //Set
        $(".selector").igNumericEditor("option", "maxValue", 100);

  • minDecimals

    Type:
    number
    Default:
    null

    Gets the minimum number of decimal places which are used in display (no focus) state.
    If number of digits in fractional part of number is less than the value of this option, then the "0" characters are used to fill missing digits.
    Note: This option has priority over possible regional settings.
    Note: In case of min decimals value higher than max decimals - max decimals are equaled to min decimals property.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
				//Initialize
				$(".selector").igNumericEditor({
						minDecimals: 5,
				});

				//Get
				var minDecimals = $(".selector").igNumericEditor("option", "minDecimals");

				//Set
				$(".selector").igNumericEditor("option", "minDecimals", 3);

  • minValue

    Type:
    number
    Default:
    null

    Gets/Sets the minimum value which can be entered in editor by end user.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
						minValue: 5,
        });

        //Get
				var minValue = $(".selector").igNumericEditor("option", "minValue");

        //Set
				$(".selector").igNumericEditor("option", "minValue", 3);

  • negativePattern

    Type:
    string
    Default:
    null

    Gets the string, which is used as negative pattern. The "n" flag represents the value of number. The "-" and "()" flags are static part of pattern.
    Note: This option has priority over possible regional settings.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            negativePattern : "- &nbsp n"
        });
        
        //Get
        var pattern = $(".selector").igNumericEditor("option", "negativePattern");
        
        //Set
        $(".selector").igNumericEditor("option", "negativePattern", "- &nbsp n");

  • negativeSign

    Type:
    string
    Default:
    null

    Gets the character, which is used as negative sign.
    Note: This option has priority over possible regional settings.
    Note: Even if the default value is null - if internationalization file is provided and it contains default values for those properties the values are imlicitly set.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            negativeSign : "-"
        });

        //Get
        var negativeSign = $(".selector").igNumericEditor("option", "negativeSign");

        //Set
        $(".selector").igNumericEditor("option", "negativeSign", "-");

  • nullValue
    Inherited

    Type:
    enumeration
    Default:
    null

    Sets/Gets the representation of null value. In case of default the value for the input is set to null, which makes the input to hold an empty string.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            nullValue : null
        });

        //Get
        var nullValue = $(".selector").igNumericEditor("option", "nullValue");

        //Set
        $(".selector").igNumericEditor("option", "nullValue", null);

  • placeHolder
    Inherited

    Type:
    string
    Default:
    null

    Gets/Sets text which appears in editor when editor has no focus and "value" in editor is null or empty string.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            placeHolder : "Enter Value"
        });

        //Get
        var placeHolder = $(".selector").igNumericEditor("option", "placeHolder");

        //Set
        $(".selector").igNumericEditor("option", "placeHolder", "Enter Value");

  • preventSubmitOnEnter
    Inherited

    Type:
    bool
    Default:
    false

    Sets the ability of the editor to prevent form submition on enter key pressed.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            preventSubmitOnEnter : false
        });

        //Get
        var preventSubmitOnEnter = $(".selector").igNumericEditor("option", "preventSubmitOnEnter");

        //Set
        $(".selector").igNumericEditor("option", "preventSubmitOnEnter", false);

  • readOnly
    Inherited

    Type:
    bool
    Default:
    false

    Gets/Sets the readonly attribute.Does not allow editing. Disables all the buttons and iteracitons applied. On submit the current value is sent into the request.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            readOnly : true
        });

        //Get
        var readOnly = $(".selector").igNumericEditor("option", "readOnly");

        //Set
        $(".selector").igNumericEditor("option", "readOnly", true);

  • regional

    Type:
    object
    Default:
    null

    Gets/Sets custom regional settings for editor. If it is string, then $.ig.regional[stringValue] is assumed.

    Code Sample

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

  • revertIfNotValid
    Inherited

    Type:
    bool
    Default:
    true

    Sets the editor to revert value to previous value in case of not valid value on blur, or enter key. If set to false clear is called.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            revertIfNotValid : true
        });

        //Get
        var revertIfNotValid = $(".selector").igNumericEditor("option", "revertIfNotValid");

        //Set
        $(".selector").igNumericEditor("option", "revertIfNotValid", true);

  • scientificFormat

    Type:
    enumeration
    Default:
    null

    Gets/Sets support for E-power format in edit mode. If that option is set, then numeric value appears as a string with possible E-power flag. In edit mode the "E" or "e" character can be entered as well. Notes: The "+" character is not supported in edit mode.

    Members

    • null
    • Type:object
    • scientific format is disabled.
    • E
    • Type:string
    • scientific format is enabled and the "E" character is used.
    • e
    • Type:string
    • scientific format is enabled and the "e" character is used.
    • E+
    • Type:string
    • scientific format is enabled and the "E" character is used. The "E+" is used for positive values in display mode.
    • e+
    • Type:string
    • scientific format is enabled and the "e" character is used. The "e+" is used for positive values in display mode.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            scientificFormat : "e"
        });

        //Get
        var scientificFormat = $(".selector").igNumericEditor("option", "scientificFormat");

        //Set
        $(".selector").igNumericEditor("option", "scientificFormat", "e+");

  • selectionOnFocus
    Inherited

    Type:
    enumeration
    Default:
    selectAll

    Set the action when the editor gets focused. The default value is selectAll.

    Members

    • selectAll
    • Type:string
    • Setting this option will select all the text into the editor when the edit mode gets enetered.
    • atStart
    • Type:string
    • Setting this option will move the cursor at the begining the text into the editor when the edit mode gets enetered.
    • atEnd
    • Type:string
    • Setting this option will move the cursor at the end the text into the editor when the edit mode gets enetered.
    • browserDefault
    • Type:string
    • Setting this option won't do any extra logic, but proceed with browser default behavior.

    Code Sample

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

  • spinDelta

    Type:
    number
    Default:
    1

    Gets/Sets delta-value which is used to increment or decrement value in editor on spin events. If value is set to negative value an exception is thrown. Non integer value is supported only for dataMode double and float.

    Code Sample

            //Initialize
        $(".selector").igNumericEditor({
            spinDelta: 2
        });
 
        //Get
        var spinDelta= $(".selector").igNumericEditor("option", "spinDelta");
 
        //Set
        $(".selector").igNumericEditor("option", "spinDelta", 2);

  • spinWrapAround

    Type:
    bool
    Default:
    false

    Sets gets ability to automatically set value in editor to opposite limit, when spin action reached minimum or maximum limit.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            spinWrapAround : true
        });

        //Get
        var spinAround = $(".selector").igNumericEditor("option", "spinWrapAround");

        //Set
        $(".selector").igNumericEditor("option", "spinWrapAround", true);

  • suppressNotifications
    Inherited

    Type:
    bool
    Default:
    false

    Disables default notifications for basic validation scenarios built in the editors such as required list selection, value wrapping around or spin limits.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            suppressNotifications : true
        });

        //Get
        var suppressNotifications = $(".selector").igNumericEditor("option", "suppressNotifications");

        //Set
        $(".selector").igNumericEditor("option", "suppressNotifications", true);

  • tabIndex
    Inherited

    Type:
    number
    Default:
    null

    Gets/Sets value in tabIndex for editor.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            tabIndex : 3
        });

        //Get
        var tabIndex = $(".selector").igNumericEditor("option", "tabIndex");

        //Set
        $(".selector").igNumericEditor("option", "tabIndex", 3);

  • textAlign

    Type:
    enumeration
    Default:
    right

    Gets/Sets horizontal alignment of text in editor. If that option is not set, then 'right' is used for 'numeric', 'currency' and 'percent' editors and the 'left' is used for all other types of editor.

    Members

    • left
    • Type:string
    • right
    • Type:string
    • center
    • Type:string

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            textAlign : "center"
        });

        //Get
        var align = $(".selector").igNumericEditor("option", "textAlign");

        //Set
        $(".selector").igNumericEditor("option", "textAlign", "center");

  • validatorOptions
    Inherited

    Type:
    object
    Default:
    null

    Sets/Gets options supported by the igValidator widget.
    Note: Validation rules of igValidator, such as min and max value/length are applied separately triggering errors,
    while similar options of the editor work to prevent wrong values from being entered.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            validatorOptions : {
               successMessage: "Success",
					     required: true,
					     onchange: true,
               notificationOptions: { mode: "popover" }
            }
        });

        //Get
        var validateOptions = $(".selector").igNumericEditor("option", "validatorOptions");

        //Set
        $(".selector").igNumericEditor("option", "validatorOptions", {onblur: true, onchange: true});

  • value
    Inherited

    Type:
    object
    Default:
    null

    Gets/Sets value in editor. The effect of setting/getting that option depends on type of editor and on dataMode options for every type of editor.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            value : 42
        });

        //Get
        var value = $(".selector").igNumericEditor("option", "value");

        //Set
        $(".selector").igNumericEditor("option", "value", 42);

  • visibleItemsCount
    Inherited

    Type:
    number
    Default:
    5

    Gets how many items should be shown at once.
    Notes:
    That option is overwritten if the number of list items is less than the value. In that case the height of the dropdown is adjusted to the number of items.
    Note! This option can not be set runtime.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            visibleItemsCount : 5
        });

        //Get
        var visibleItemsCount = $(".selector").igNumericEditor("option", "visibleItemsCount");

        //Set
        $(".selector").igNumericEditor("option", "visibleItemsCount", 5);

  • width
    Inherited

    Type:
    enumeration
    Default:
    null

    Gets/Sets how the width of the control can be set.

    Members

    • null
    • Type:object
    • will stretch to fit data, if no other widths are defined.
    • string
    • The widget width can be set in pixels (px) and percentage (%).
    • number
    • The widget width can be set as a number in pixels.

    Code Sample

     
        //Initialize
        $(".selector").igNumericEditor({
            width : 200
        });

        //Get
        var width = $(".selector").igNumericEditor("option", "width");

        //Set
        $(".selector").igNumericEditor("option", "width", 200);

For more information on how to interact with the Ignite UI controls' events, refer to
Using Events in Ignite UI.

Note: Calling API methods programmatically does not raise events related to their operation unless specifically stated otherwise by the corresponding API documentation; those events are only raised by their respective user interaction.

Show Details

  • blur
    Inherited

    Cancellable:
    false

    Event which is raised when input field of editor loses focus.
    Function takes argument evt.
    Use ui.owner to obtain reference to igEditor.
    Use evt.originalEvent to obtain reference to event of browser.

    Code Sample

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

              //return browser event
              evt.originalEvent;
          });

          //Initialize
          $(".selector").igNumericEditor({
              blur: function (evt) {
              ...
              }
          });

  • dropDownItemSelected
    Inherited

    Cancellable:
    true

    Event which is raised when the drop down list item is selected.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.
    Use ui.item to obtain reference to the list item which is selected.

    Code Sample

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

              //return browser event
              evt.originalEvent;
              
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
				      //use to obtain reference to the list item which is selected
              ui.item;
          });

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

  • dropDownItemSelecting
    Inherited

    Cancellable:
    true

    Event which is raised when the drop down list item is selecting.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.
    Use ui.item to obtain reference to the list item which is about to be selected.

    Code Sample

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

              //return browser event
              evt.originalEvent;
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
				      //use to obtain reference to the list item which is selected
              ui.item;
          });

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

  • dropDownListClosed
    Inherited

    Cancellable:
    false

    Event which is raised when the drop down is already closed.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.

    Code Sample

                 $(document).delegate(".selector", "ignumericeditordropDownListClosed", function (evt, ui) {                  
             
             //return browser event
              evt.originalEvent;
              
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
            });
            
            //Initialize
            $(".selector").igNumericEditor({
                dropDownListClosed: function (evt, ui) {
                ...
                }
            });

  • dropDownListClosing
    Inherited

    Cancellable:
    true

    Event which is raised when the drop down is closing.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.

    Code Sample

                 $(document).delegate(".selector", "ignumericeditordropDownListClosing", function (evt, ui) {                  
              
              //return browser event
              evt.originalEvent;
              
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
            });
            
            //Initialize
            $(".selector").igNumericEditor({
                dropDownListClosing: function (evt, ui) {
                ...
                }
            });

  • dropDownListOpened
    Inherited

    Cancellable:
    false

    Event which is raised when the drop down is already opened.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.

    Code Sample

                 $(document).delegate(".selector", "ignumericeditordropDownListOpened", function (evt, ui) {                  
                
              //return browser event
              evt.originalEvent;
              
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
            });
            
            //Initialize
            $(".selector").igNumericEditor({
                dropDownListOpened: function (evt, ui) {
                ...
                }
            });

  • dropDownListOpening
    Inherited

    Cancellable:
    true

    Event which is raised when the drop down is opening.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.editorInput to obtain reference to the editable input
    Use ui.list to obtain reference to the list contaier.

    Code Sample

                 $(document).delegate(".selector", "ignumericeditordropDownListOpened", function (evt, ui) {                  
                
              //return browser event
              evt.originalEvent;
              
              //use to obtain reference to igEditor
              ui.owner;
				      //use to obtain reference to the editable input
              ui.editorInput;
				      //use to obtain reference to the list contaier 
              ui.list;
            });
            
            //Initialize
            $(".selector").igNumericEditor({
                dropDownListOpened: function (evt, ui) {
                ...
                }
            });

  • focus
    Inherited

    Cancellable:
    false

    Event which is raised when input field of editor gets focus.
    Function takes argument evt.
    Use ui.owner to obtain reference to igEditor.
    Use evt.originalEvent to obtain reference to event of browser.

    Code Sample

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

  • keydown
    Inherited

    Cancellable:
    true

    Event which is raised on keydown event.
    Return false in order to cancel key action.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.key to obtain value of keyCode.

    Code Sample

          $(document).delegate(".selector", "ignumericeditorkeydown", function (evt, ui) {
          //return browser event
          evt.originalEvent;
          //use to obtain reference to igEditor 
          ui.owner; 
          //use to obtain value of keyCode
          ui.key;
      });

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

  • keypress
    Inherited

    Cancellable:
    true

    Event which is raised on keypress event.
    Return false in order to cancel key action.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.key to obtain value of keyCode.
    Set ui.key to another character which will replace original entry.

    Code Sample

            $(document).delegate(".selector", "ignumericeditorkeypress", function (evt, ui) {
            //return browser event
            evt.originalEvent;
            //use to obtain reference to igEditor 
            ui.owner;
            //use to obtain value of keyCode
            ui.key;
            //set the ui.key to "A" -a cahracter which will replace the original entry
            ui.key = 65;
        });

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

  • keyup
    Inherited

    Cancellable:
    false

    Event which is raised on keyup event.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.key to obtain value of keyCode.

    Code Sample

            $(document).delegate(".selector", "ignumericeditorkeyup", function (evt, ui) {
            //return browser event
            evt.originalEvent;
            
            //use to obtain reference to igEditor 
            ui.owner;
            //use to obtain value of keyCode
            ui.key;

        });

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

  • mousedown
    Inherited

    Cancellable:
    false

    Event which is raised on mousedown at any part of editor including drop-down list.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.elementType to obtain type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
    Use ui.id and ui.elementType to obtain flag which represents html element under mouse.

    Code Sample

            $(document).delegate(".selector", "ignumericeditormousedown", 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").igNumericEditor({
            mousedown: function (evt, ui) {
            ...
            }
        });

  • mousemove
    Inherited

    Cancellable:
    false

    Event which is raised on mousemove at any part of editor including drop-down list.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.elementType to obtain type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
    Use ui.id and ui.elementType to obtain flag which represents html element under mouse.

    Code Sample

            $(document).delegate(".selector", "ignumericeditormousemove", 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").igNumericEditor({
            mousemove: function (evt, ui) {
            ...
            }
        });

  • mouseout
    Inherited

    Cancellable:
    false

    Event which is raised on mouseleave at any part of editor including drop-down list.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.elementType to obtain type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
    Use ui.id and ui.elementType to obtain flag which represents html element under mouse.

    Code Sample

            $(document).delegate(".selector", "ignumericeditormouseout", 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").igNumericEditor({
            mouseout: function (evt, ui) {
            ...
            }
        });

  • mouseover
    Inherited

    Cancellable:
    false

    Event which is raised on mouseover at any part of editor including drop-down list.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.elementType to obtain type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
    Use ui.id and ui.elementType to obtain flag which represents html element under mouse.

    Code Sample

          $(document).delegate(".selector", "ignumericeditormouseover", 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").igNumericEditor({
          mouseover: function (evt, ui) {
          ...
          }
      });

  • mouseup
    Inherited

    Cancellable:
    false

    Event which is raised on mouseup at any part of editor including drop-down list.
    Function takes arguments evt and ui.
    Use evt.originalEvent to obtain reference to event of browser.
    Use ui.owner to obtain reference to igEditor.
    Use ui.elementType to obtain type of html element under mouse, such as field, button, spinUpper, spinLower or item#.
    Use ui.id and ui.elementType to obtain flag which represents html element under mouse.

    Code Sample

          $(document).delegate(".selector", "ignumericeditormouseup", 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").igNumericEditor({
          mouseup: function (evt, ui) {
          ...
          }
      });

  • rendered
    Inherited

    Cancellable:
    false

    Event which is raised after rendering of the editor completes.
    Function takes arguments evt and ui.
    Use ui.owner to get a reference to the editor performing rendering.
    Use ui.element to get a reference to the editor element.

    Code Sample

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

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

  • rendering
    Inherited

    Cancellable:
    false

    Event which is raised before rendering of the editor completes.
    Function takes arguments evt and ui.
    Use ui.owner to get a reference to the editor performing rendering.
    Use ui.element to get a reference to the editor element.

    Code Sample

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

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

  • textChanged
    Inherited

    Cancellable:
    false

    Event which is raised after text in editor was changed. It can be raised when keyUp event occurs,
    or when the clear button is clicked or when an item from a list is selected.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.text to obtain new text
    Use ui.oldText to obtain the old text.

    Code Sample

            $(document).delegate(".selector", "ignumericeditortextChanged", function (evt, ui) {
          
          //Use to obtain reference to igEditor
          ui.owner;
				  //Use to obtain new text
          ui.text;
				  //Use to obtain the old text
          ui.oldText;
        });

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

  • valueChanged
    Inherited

    Cancellable:
    false

    Event which is raised after value in editor was changed. It can be raised on lost focus or on spin events.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.newValue to obtain the new value.
    Use ui.originalValue to obtain the original value.
    Use ui.editorInput to obtain reference to the editor input.

    Code Sample

            $(document).delegate(".selector", "ignumericeditorvaluechanged", 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").igNumericEditor({
            valueChanged: function (evt, ui) {
            ...
            }
        });

  • valueChanging
    Inherited

    Cancellable:
    true

    Event which is raised before value in editor was changed.
    Return false in order to cancel change.
    It can be raised on lost focus or on spin events.
    Function takes arguments evt and ui.
    Use ui.owner to obtain reference to igEditor.
    Use ui.newValue to obtain the new value.
    Use ui.oldValue to obtain the old value.
    Use ui.editorInput to obtain reference to the editor input.

    Code Sample

            $(document).delegate(".selector", "ignumericeditorvaluechanging", 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").igNumericEditor({
            valueChanging: function (evt, ui) {
            ...
            }
        });

  • clearButton
    Inherited

    .igNumericEditor( "clearButton" );
    Return Type:
    jquery
    Return Type Description:
    Returns reference to jquery object.

    Returns a reference to the clear button UI element of the editor.

    Code Sample

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

  • destroy
    Inherited

    .igNumericEditor( "destroy" );

    Destructor of the widget.

    Code Sample

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

  • displayValue
    Inherited

    .igNumericEditor( "displayValue" );
    Return Type:
    string
    Return Type Description:
    Visible text of the editor.

    Gets visible text in the editor.

    Code Sample

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

  • dropDownButton
    Inherited

    .igNumericEditor( "dropDownButton" );
    Return Type:
    jquery
    Return Type Description:
    Returns reference to jquery object.

    Returns a reference to the clear button UI element of the editor.

    Code Sample

     
        $(".selector").igNumericEditor("dropDownButton");

  • dropDownContainer
    Inherited

    .igNumericEditor( "dropDownContainer" );
    Return Type:
    jquery
    Return Type Description:
    Returns reference to jquery object.

    Gets reference to jquery object which is used as container of drop-down.

    Code Sample

     
        $(".selector").igNumericEditor("dropDownContainer");

  • dropDownVisible
    Inherited

    .igNumericEditor( "dropDownVisible" );
    Return Type:
    bool
    Return Type Description:
    The visibility state of the drop down.

    Returns the visibility state of the drop down listing the items.

    Code Sample

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

  • editorContainer
    Inherited

    .igNumericEditor( "editorContainer" );
    Return Type:
    jquery
    Return Type Description:
    The container editor element.

    Gets reference to jquery object which is used as top/outer element of igEditor.

    Code Sample

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

  • field
    Inherited

    .igNumericEditor( "field" );
    Return Type:
    jquery
    Return Type Description:
    The visual editor element.

    Gets the visual editor element.

    Code Sample

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

  • findListItemIndex

    .igNumericEditor( "findListItemIndex", number:number );
    Return Type:
    number
    Return Type Description:
    Returns index of the found item.

    Finds index of list item by text that matches with the search parameters.

    • number
    • Type:number
    • The text to search for.

    Code Sample

     
        $(".selector").igNumericEditor("findListItemIndex");

  • getRegionalOption

    .igNumericEditor( "getRegionalOption" );
    Return Type:
    string
    Return Type Description:
    Current regional.

    Get current regional.

    Code Sample

     
        $(".selector").igNumericEditor("getRegionalOption");

  • getSelectedListItem
    Inherited

    .igNumericEditor( "getSelectedListItem" );
    Return Type:
    jquery
    Return Type Description:
    Selected list item.

    Gets selected list item.

    Code Sample

     
        $(".selector").igNumericEditor("getSelectedListItem");

  • hasFocus
    Inherited

    .igNumericEditor( "hasFocus" );
    Return Type:
    bool
    Return Type Description:
    Returns if the editor is focused or not.

    Checks if editor has focus.

    Code Sample

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

  • hide
    Inherited

    .igNumericEditor( "hide" );

    Hides editor.

    Code Sample

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

  • hideDropDown
    Inherited

    .igNumericEditor( "hideDropDown" );

    Hides the drop down list.

    Code Sample

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

  • inputName
    Inherited

    .igNumericEditor( "inputName", [newValue:string] );
    Return Type:
    string
    Return Type Description:
    Current input name.

    Gets/Sets name attribute applied to the editor element.

    • newValue
    • Type:string
    • Optional
    • The new input name.

    Code Sample

     
        $(".selector").igNumericEditor("inputName", "newName");

  • insert
    Inherited

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

    Paste text at location of caret. Note: method raises the "valueChanged" event.

    • string
    • Type:string
    • The string to be inserted.

    Code Sample

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

  • isValid
    Inherited

    .igNumericEditor( "isValid" );
    Return Type:
    bool
    Return Type Description:
    Whether editor value is valid or not.

    Checks if value in editor is valid. Note: This function will not trigger automatic notifications.

    Code Sample

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

  • select
    Inherited

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

    Selects text in editor. If parameters are equal, then than method sets location of caret. That method has effect only when editor has focus.

    • start
    • Type:number
    • Start of the selection.
    • end
    • Type:number
    • End of the selection.

    Code Sample

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

  • selectedListIndex
    Inherited

    .igNumericEditor( "selectedListIndex", [index:number] );
    Return Type:
    number
    Return Type Description:
    Returns the selected index.

    Gets/Sets selected list item index.

    • index
    • Type:number
    • Optional
    • The index of the item that needs to be selected.

    Code Sample

     
        $(".selector").igNumericEditor("selectedListIndex", 1);

  • selectListIndexDown

    .igNumericEditor( "selectListIndexDown" );

    Moves the hovered index to the item that appears above the current one in the list.

    Code Sample

     
        $(".selector").igNumericEditor("selectListIndexDown", 1);

  • selectListIndexUp

    .igNumericEditor( "selectListIndexUp" );

    Moves the hovered index to the item that appears above the current one in the list.

    Code Sample

     
        $(".selector").igNumericEditor("selectListIndexUp", 2);

  • setFocus
    Inherited

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

    Set focus to editor with delay.

    • delay
    • Type:number
    • Optional
    • The delay before focusing the editor.

    Code Sample

     
        $(".selector").igNumericEditor("setFocus", 200);

  • show
    Inherited

    .igNumericEditor( "show" );

    Shows editor.

    Code Sample

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

  • showDropDown
    Inherited

    .igNumericEditor( "showDropDown" );

    Shows the drop down list.

    Code Sample

     
        $(".selector").igNumericEditor("showDropDown");

  • spinDown

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

    Decrements value in editor according to the parameter.

    • delta
    • Type:number
    • Optional
    • Decrement value.

    Code Sample

     
        $(".selector").igNumericEditor("spinDown");

  • spinDownButton
    Inherited

    .igNumericEditor( "spinDownButton" );
    Return Type:
    jquery
    Return Type Description:
    The jQuery object representing the spin down UI element of the editor.

    Returns a reference to the spin down UI element of the editor.

    Code Sample

     
        $(".selector").igNumericEditor("spinDownButton");

  • spinUp

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

    Increments value in editor according to the parameter.

    • delta
    • Type:number
    • Optional
    • Increments value.

    Code Sample

     
        $(".selector").igNumericEditor("spinUp");

  • spinUpButton
    Inherited

    .igNumericEditor( "spinUpButton" );
    Return Type:
    jquery
    Return Type Description:
    The jQuery object representing the spin up UI element of the editor.

    Returns a reference to the spin up UI element of the editor.

    Code Sample

     
        $(".selector").igNumericEditor("spinUpButton");

  • validate
    Inherited

    .igNumericEditor( "validate" );
    Return Type:
    bool
    Return Type Description:
    Whether editor value is valid or not.

    Triggers validation of editor and show potential warning message. If validatorOptions are set will also call validate on the igValidator.

    Code Sample

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

  • validator
    Inherited

    .igNumericEditor( "validator" );
    Return Type:
    object
    Return Type Description:
    Returns reference to igValidator or null.

    Gets reference to igValidator used by the editor.

    Code Sample

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

  • value

    .igNumericEditor( "value", [newValue:number] );
    Return Type:
    number
    Return Type Description:
    Current editor value.

    Gets/Sets editor value.

    • newValue
    • Type:number
    • Optional
    • New editor value.

    Code Sample

     
        $(".selector").igNumericEditor("value", 25);

  • ui-state-active

    Class applied to the top element when editor is active. Default value is 'ui-state-active'.

  • ui-igedit-button-common ui-unselectable

    Class applied commonly to all the button containers, Default value is 'ui-igedit-button-common ui-unselectable ui-igedit-button-ltr ui-state-default'.

  • ui-igedit-buttonhover ui-state-hover

    Classes applied to the SPAN element of button in mouse-over state. Default value is 'ui-igedit-buttonhover ui-state-hover'.

  • ui-igedit-buttonpressed ui-state-highlight

    Classes applied to the SPAN element of button in pressed state. Default value is 'ui-igedit-buttonpressed ui-state-highlight'.

  • ui-igedit-cleararea ui-state-default

    Class applied to the div holding the clear button. Default value is 'ui-igedit-cleararea ui-state-default'.

  • ui-igedit-buttonimage ui-icon-circle-close

    Class applied to the div holding the clear button image. Default value is '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

    Class applied to the top element when editor is rendered in container. Default value is 'ui-igedit ui-igedit-container ui-widget ui-corner-all ui-state-default'.

  • ui-state-disabled

    Classes applied to the editing element in disabled state. Default value is 'ui-igedit-disabled ui-state-disabled'.

  • ui-igedit-dropdown-button

    Class applied to the div holding the drop down button. Default value is 'ui-igedit-dropdown-button'.

  • ui-icon ui-icon-triangle-1-s ui-igedit-buttonimage

    Class applied to the div holding the drop down button image. Default value is 'ui-icon ui-icon-carat-1-s ui-igedit-buttonimage'.

  • ui-igedit-dropdown ui-widget

    Class applied to the container holding the listitems. Default value is 'ui-igedit-dropdown'.

  • ui-igedit-input

    Class applied to the main/top element. Default value is 'ui-igedit-input'.

  • ui-igeditor-input-container ui-corner-all

    Class applied to the div which wraps the editable input (in case of multiline textarea). Default value is "ui-igeditor-input-container ui-corner-all".

  • ui-state-focus

    Class applied to the top element when editor is on focus. Default value is 'ui-state-focus'.

  • ui-state-hover

    Class applied to the top element when editor is hovered. Default value is 'ui-state-hover'.

  • ui-igedit-listitem ui-state-default

    Class applied to the SPAN element which represents item in dropdown list. Default value is 'ui-igedit-listitem ui-state-default'.

  • ui-state-active ui-igedit-listitemactive

    Class applied to the Class applied to the SPAN element which represents active item in dropdown list. Default value is 'ui-igedit-listitemselected ui-state-highlight'.

  • ui-igedit-listitemhover ui-state-hover

    Class applied to the Class applied to the SPAN element which represents item in dropdown list with mouse-over state. Default value is 'ui-igedit-listitemhover ui-state-hover'.

  • ui-igedit-listitemselected ui-state-highlight

    Class applied to the Class applied to the SPAN element which represents selected item in dropdown list. Default value is 'ui-igedit-listitemselected ui-state-highlight'.

  • ui-igedit-negative

    Class applied to the editing element of numeric editor when value is negative. The class is applied only when the editor is in display mode (no focus). Default value is 'ui-igedit-negative'.

  • ui-igedit-placeholder

    Class applied to the visible input in case of plaseHolder option set. This class is related only to the placeHolder styling. Default value is 'ui-igedit-placeholder'.

  • ui-igedit-spinlowerimage ui-icon-carat-1-s ui-icon

    Class applied to the div holding the spin down button image. Default value is '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

    Class applied to the div holding the spin up button image. Default value is "ui-igedit-spinupperimage ui-icon-carat-1-n ui-icon ui-igedit-buttondefault ui-igedit-spinbutton ui-igedit-buttonimage'.

  • ui-igedit-textarea

    Class applied to the visible textarea element in case of textMode set to 'multiline'.

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

#