I want to make a logic before submitting which states that input value shouldn't be any empty value and it should be greater than 0.
const minValue = (input) => {
if(input < 0){
alert('input has to be greater than 0')
}else{
return input;
}
}
<Form className = "workout-form">
<div className ="form-row">
<label className ="form__label">Distance</label>
<input type = 'number' value = {distance} min = '0' onChange = {(e) => setDistance(minValue(e.target.value))} className ="form__input form__input--distance" placeholder="mi" autoFocus required/>
</div>
<button className ="form-btn" onClick = {submitWorkout}>Add Workout</button>
</Form>
If this code works for checking for negative values you should be able to change if (input < 0) to if ((input < 0) || (input != ""))
const handleChange = e => { const value = parseInt(e.target.value); if(!isNaN(value) && value > 1){ setDistance(value) } }
onChange={handleChange}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.