XUL:Specs:NumberBox

Requirements

• Need a widget for entering numbers. Does not allow entry of non-numeric characters
• Uses two arrow buttons rendered in native theme. Clicking the arrow buttons increases or decreases the number in the field.

Number Box

A widget for entering numbers will be created. It consists of a field with two arrows beside it for incrementing and decrementing the value. The element has the following syntax:

<textbox type="number"
         min="10"
         max="20"
         value="12"
         increment="2"
         decimalplaces="0"/>

The widget supports all the attributes and properties of the textbox, and implements nsIDOMXULTextBoxElement.

All attributes shown above have a corresponding property. The decimalPlaces property corresponds to the decimalplaces attribute. The wrapAround property corresponds to the wraparound attribute.

min 

The minimum value the number in the field may be. The value cannot be decreased below this value. The default value is 0. To set no minimum value, use -Infinity.

max 

The maximum value the number in the field may be. The value cannot be increased above this value. The default value is Infinity.

value 

The current value of the field. The default value is 0 or the value of the min attribute, whichever is higher.

increment 

The amount the number in the field is incremented or decremented when the arrows are pressed. The default value is 1.

decimalplaces 

the number of decimal places to display. The default value is 0, which doesn't show decimal places. The value Infinity may be used for unlimited decimal places. Note that decimal numbers are stored as floats.

wraparound 

if true, the values will wrap around when reachng the minimum or maximum values. Both the min and max must not be Infinity.

hidespinbuttons 

if true, the spinbuttons are hidden. The default value is false.

The special value Infinity may be used for either the min or max attributes to indicate no minimum or maximum value, which generally means the lowest or highest value possible that can be supported.

Negative values are also supported for the min, value and max attributes.

Only the characters 0-9 may be displayed in the field. If the min attribute is less than 0, the minus sign (-) may also be entered. If the decimalplaces attribute is greater than 0, the locale dependent decimal point symbol may also be entered.

Methods:

increase() 

increment the current value by the value of the increment property

decrease() 

decrement the current value by the value of the increment property

Events:

The number box sends the same events as the <textbox>

Currency Box

The currency box is the same as the number box except dispays value as curencies.

<textbox type="currency"
         value="250"/>

Spinbuttons

The spinbuttons element displays two arrows for incrementing and decrementing a value. It is used as part of the number box, however other XBL-implemented widgets can use it as well.

<spinbuttons/>

Events:

up (onup) 

fired when the increment button is pressed.

down (ondown) 

fired when the decrement button is pressed.

Repeat button

A repeat button is just a button where the action associated with the button activates repeatedly as long as the mouse button is held down. That is, the command event fires repeatedly. It can be used with:

<button type="repeat" label="OK"/>

It would not normally be used with a typical button, but it would commonly be used for up/down arrow buttons like those used in the spinbuttons.