Skip to content

jQuery numericinput manipulating the numericinput after creating

Maikel Bos edited this page Feb 11, 2020 · 2 revisions

It's possible to manipulate the numeric input via client-side javascript. The numericinput plugin can be called with a callback parameter function. The function provides access to the Numericinput object via this as a first parameter. It is possible to call the numericinput function multiple times on a selector; this will only create the input once but provide access to the numeric input on the first and on subsequent calls.

<script type="text/javascript">
    var value;
    
    $('#example-input').numericinput(function(input) {
        // this refers to the numericinput object
        value = this.getValue();
        
        // parameter input also refers to the numericinput object
        input.setValue(10);
    });
</script>

When also providing options to the numericinput, the callback function becomes the second parameter of the call to the numericinput function.

<script type="text/javascript">
    var options = {
        getMinimumValue: function() { return 100; }
    };
    $('#example-input').numericinput(options, function () {
        console.log(this.getValue());
    });
</script>

Please note that this gives you access to the numericinput internal properties. Manipulating these properties is unsupported and can create unexpected side effects.

Functions

  • remove() removes the numericinput functionality and restores the elements to their original condition
  • getValue() gets the current value as a float
  • setValue(value) sets the value to the provided parameter; the value should be a float; please note that the new value is NOT checked against minimum and maximum allowed values
  • Internal functions
    • error triggers the temporary error state
Clone this wiki locally