Issue
I have a text field:
<Grid item xs={12} sm={6}>
<BzTextField
fullWidth
label="dec"
value={company.dex}
/>
</Grid>
what I am trying to do is to create a new component so I can create a new input type number which must add 3 decimal digits (ex. 3.3 becomes 3.300). I am having problem with how to implement something like this. Should I use Hooks or is there an easier way.
also the validation should be onChange and not on keyUp.
Solution
You can do it by creating a controlled input and using input's onBlur feature, which will execute onBlur function when you are done editing the input. This function will change add 3 decimal digits to the number.
function App() {
const [input, setInput] = React.useState("")
const onBlur = () => {
setInput(parseFloat(input).toFixed(3))
}
return (
<div >
<body>
<input
type="number"
value={input}
onChange={e=>setInput(e.target.value)}
onBlur={onBlur}
/>
</body>
</div>
);
}
Answered By - user3228358 Answer Checked By - David Marino (PHPFixing Volunteer)
Posts
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.