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 he attributes and properties of the textbox, and implements nsIDOMXULTextBoxElement.

All attributes shown above have a corresponding property. The decimalPlaces rerty corrsponds to the decimalplaces atribute.

min

The minimum value the number in the field may be. The value cannot be decreased below this value. The default value is 0.

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 decmal places to display. The default value is 0, which doesn't show decimal places.

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 dependant decimal point symbol may also be entered. Other locale-specific separator characters may also be allowed.

Methods:

increase()

increment thae current value by the value of the increment property

decrease()

decrement thae 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.