Widgets > Input Widgets > wijinputnumber |
Open the .cshtml for the View in which you want to display a wijinputnumber. Add a textbox element like in the following markup:
<input type="text" id="textbox1" />
Now you need to initialize the wijinputnumber widget, which you can do by adding the following script to the .cshtml file:
<script type="text/javascript">
$(function() {
$("#textbox1").wijinputnumber(
{
type: 'numeric',
minValue: -100,
maxValue: 1000,
decimalPlaces: 3,
showSpinner: true
});
});
</script>
The options set in the script above will create an input that will only allow users to enter numbers (no percentages, no currency). The user won't be able to input anything lower than -100 or higher than 1,000, and the input will always display to the third decimal place, even when the widget holds no value. It will also display a spinner so that users can increase or decrease the value instead of having to type it in.
If you were to put this into a project and run it, the widget would look as follows:
For more information about wijgrid, click one of the external links to view our Wijmo wiki documentation: