Comments (2)
You are not missing anything. The type
is "text"
on purpose since the HTML5 apis for validation are not flexible enough to allow detecting exactly the reason for invalid input (<input type="number" />
just uses a regex to test the whole value and once this value dose not match it sets the input to invalid state). And as well when the input becomes invalid it's value
prop becomes empty string which breaks the UX since the user sees an error message but the input's value is already an empty string which forced me to create material-ui-number-input
in first place ...
The idea of the project is to allow the developer to decide the behavior of the input whether ii's possible for the user to enter invalid symbols and get an error message or get a warning message and auto corrected value or just force valid numbers to be entered without displaying any message at all while the developer can really get a valid number once the input is really a valid number. This behavior can be changed in the demo by selecting a strategy
. As well the behavior can be further changed based on the value of min
and max
props as well is the input required or not.
Lucky for you if you decide to use my project and you want your users to get number pad on focus there is the HTML5 property inputmode
which is as well supported by React. I've also added support for it in NumberInputProps
and NumberInput.PropTypes
whit the 5.0.16
release. So setting it to "numeric"
should open a number pad.
I' ll add the display number pad option as well option to display meaningful messages and option to handle only "critical" errors later today.
from material-ui-number-input.
@jamiegiftbit I've added the inputMode
to the live demo but it dose not work for mine Android tablet can you check on your phone?
from material-ui-number-input.
Related Issues (14)
- Demo please? HOT 4
- Dependency on material-ui 0.17.x HOT 1
- Remove propTypes or use prop-types package instead HOT 1
- JSX element type 'NumberInput' is not a constructor function for JSX elements. Types of property 'setState' are incompatible. HOT 5
- Validating number started falling without a reason. Value is not longer a String. HOT 5
- Why does onChange return a string? HOT 1
- Does this package work with stateless components?
- Upgrade to material-ui 1.0
- Fix all bugs introduced with 5.0.13 and 5.0.12 HOT 1
- [Test] Write unit-tests for NumberInput
- min not resetting the input value as expected and preventing negative numbers HOT 4
- Hint text not behaving correctly HOT 1
- Empty material-ui-number-input folder in node_modules HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from material-ui-number-input.