jQuery EasyUI Form Plugin - Spinner
Extends from $.fn.validatebox.defaults. Overrides the default defaults with $.fn.spinner.defaults.
The spinner combines an editable text box with two small buttons, allowing the user to select a value from a range of values. Similar to the combobox, the spinner allows the user to enter a value, but it does not have a dropdown list. The spinner is the base component for creating other spinner components such as numberspinner, timespinner, etc.
Dependencies
- validatebox
Usage
The spinner should be created using JavaScript. It is not allowed to create it from markup.
<input id="ss" value="2">
$('#ss').spinner({
required: true,
increment: 10
});
Properties
This property extends from validatebox, and the following are the properties added for the spinner.
| Name | Type | Description | Default Value |
|---|---|---|---|
| width | number | The width of the component. | auto |
| height | number | The height of the component. This property is available since version 1.3.2. | 22 |
| value | string | The initial value. | |
| min | string | The minimum allowed value. | null |
| max | string | The maximum allowed value. | null |
| increment | number | The increment value when the spinner buttons are clicked. | 1 |
| editable | boolean | Defines whether the user can directly input a value into the text field. | true |
| disabled | boolean | Defines whether the text field is disabled. | false |
| spin | function(down) | The function called when the user clicks the spinner buttons. The 'down' parameter indicates whether the user clicked the down spinner button. |
Events
| Name | Parameters | Description |
|---|---|---|
| onSpinUp | none | Triggered when the user clicks the up spinner button. |
| onSpinDown | none | Triggered when the user clicks the down spinner button. |
Methods
This method extends from validatebox, and the following are the methods added for the spinner.
| Name | Parameters | Description |
|---|---|---|
| options | none | Returns the options object. |
| destroy | none | Destroys the spinner component. |
| resize | width | Resizes the component's width. Overrides the initial width by passing the 'width' parameter. <br>Example: $('#ss').spinner('resize'); // resize with original width<br>$('#ss').spinner('resize', 200); // resize with new width |
| enable | none | Enables the component. |
| disable | none | Disables the component. |
| getValue | none | Gets the value of the component. |
| setValue | value | Sets the value of the component. |
| clear | none | Clears the value of the component. |
| reset | none | Resets the value of the component. This method is available since version 1.3.2. |