Yup validation to accept more than 0 input digit. Like user can enter 0.001 or 0.0001. But not only 0

Viewed 2210

I'm working on a project, where on the admin panel, doctor can set commission for their treatment. But it can be only 2 digit long. But commission can't be 0. It can be anything 0.01 or 0.001. I have created a form using formik and yup. But don't know how to set input field for this work. I have tried & searched, but not found any solution.

Yup validation

  commission: Yup.string()
      .required()
      .matches(/^[0-9]+$/, "Commission should contain only digits")
      // .min(1, 'Must be exactly 1 digits')
      .max(2, "Commission should not be more than 2 digits"),

input field code

<div className="form-group">
                        <label>
                          Commission(%) <span className="text-danger">*</span>{" "}
                        </label>
                        <input
                          type="text"
                          className="form-control"
                          name="commission"
                          value={formik.values.commission}
                          onChange={formik.handleChange}
                          onBlur={formik.handleBlur}
                          min="0.01"
                        ></input>
                        {formik.touched.commission &&
                        formik.errors.commission ? (
                          <div className="err">{formik.errors.commission}</div>
                        ) : null}
                      </div>```


1 Answers

Update your yup validation to:

commission: Yup.number()
      .required()
      .moreThan(0, 'commision should not be zero or less than zero')
      .lessThan(100, "Commission should not be more than 2 digits"),

And also change you input field type:

<input
     type='number'
     ...
   />
Related