Roll Widget
Roll is a number roller widget. It helps to capture only the number inputs from user. It has easy navigation with up and down buttons and user can use up and down arrows to change the value.
Basic Usage $.domLoaded(function() { $.get("#drp").widget("roll", CONFIG_JSON ); }
Configuring Options
It contains array of JSON objects. The properties are mentioned below.
Methods
Number Roller Widget Examples Example 1
JS
HTML
$.domLoaded( function() { $.get("#roll1").widget("roll", { range : { from : -10, to : 10 }, unit : 5, def : 0, dim : { wid : 100 } }); $.get("#roll2").widget("roll", { unit : 3, def : -10, dim : { wid : 60 } }); $.get("#roll3").widget("roll", { range : { from : 0, to : 2.3 }, unit : 0.1, def : 0, dim : { wid : 80 } }); $.get("#roll4").widget("roll", { range : { from : 0 }, dim : { wid : 70 } }); $.get("#roll5").widget("roll", { range : { to : 1, from : -1 }, unit : 0.001, dim : { wid : 100 } }); var rol = $.get("#roll6").widget("roll", { dim : { wid : 70 }, enabled : false }); $.get("#enab").on("click", function() { rol.enable(); }); $.get("#disb").on("click", function() { rol.disable(); }); });
Result
| |||||||||||||||||||||||||||||||||||||||||||||||||||||||||