Numeric Input

Member Of	Wijmo Value Control
Base Control	HTML5 input, type=number
Description	Provides a default implementation of a numeric value control.
Usage	Apply to an entity property having a numeric data type.

Generated Code	Copy Code
myapp.ScreenName.PropertyName_render = function (element, contentItem) { var input = $("<input type='number' data-clear-btn='true'/>"); input.appendTo($(element)); input[0].onchange = function (e, args) { contentItem.value = parseInt(input.val()); }; contentItem.dataBind("stringValue", function (newValue) { input.val(newValue); }); };

Generated Code

Copy Code

myapp.ScreenName.PropertyName_render = function (element, contentItem) {

    var input = $("<input type='number' data-clear-btn='true'/>");
    input.appendTo($(element));

    input[0].onchange = function (e, args) {
        contentItem.value = parseInt(input.val());
    };

    contentItem.dataBind("stringValue", function (newValue) {
        input.val(newValue);
    });
};

Remarks

This widget uses the native numeric keypad when editing is initiated on a mobile device. It is included for completeness and to provide a reasonable default implementation for numeric value controls. You can also use the generated code as a starting point for working with other third-party control libraries.

The onchange event is handled to update the bound value whenever the end user changes the input control’s current value.

The dataBind method call ensures that the widget stays in sync whenever the bound value changes.