I'm having Bootstrap and I have problem with validation. I need input only positive integer. How to implement it?
For example:
<div> <input type="number" id="replyNumber" data-bind="value:replyNumber" /> </div>
Mobile Number validation criteria:The first digit should contain numbers between 6 to 9. The rest 9 digit can contain any number between 0 to 9. The mobile number can have 11 digits also by including 0 at the starting. The mobile number can be of 12 digits also by including 91 at the starting.
Bootstrapping Validation is a way to predict the fit of a model to a hypothetical testing set when an explicit testing set is not available.
Here's how form validation works with Bootstrap: HTML form validation is applied via CSS's two pseudo-classes, :invalid and :valid . It applies to <input> , <select> , and <textarea> elements. Bootstrap scopes the :invalid and :valid styles to parent .was-validated class, usually applied to the <form> .
We have used isNaN() function for validation of the textfield for numeric value only. Text-field data is passed in the function and if passed data is number then isNan() returns true and if data is not number or combination of both number and alphabets then it returns false.
It's not Twitter bootstrap specific, it is a normal HTML5 component and you can specify the range with the min
and max
attributes (in your case only the first attribute). For example:
<div> <input type="number" id="replyNumber" min="0" data-bind="value:replyNumber" /> </div>
I'm not sure if only integers are allowed by default in the control or not, but else you can specify the step
attribute:
<div> <input type="number" id="replyNumber" min="0" step="1" data-bind="value:replyNumber" /> </div>
Now only numbers higher (and equal to) zero can be used and there is a step of 1, which means the values are 0, 1, 2, 3, 4, ... .
BE AWARE: Not all browsers support the HTML5 features, so it's recommended to have some kind of JavaScript fallback (and in your back-end too) if you really want to use the constraints.
For a list of browsers that support it, you can look at caniuse.com.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With