React Hook Form Only Numeric Pattern

Question

I only want numeric character input in the pattern, but it also accepts when I say ms3 for example. I want only numeric characters to be accepted. How do you think I can do?

<td>
                                                    <input
                                                        type="text"
                                                        className="form-control text-uppercase"
                                                        id="date_of_delivery"
                                                        name="date_of_delivery"
                                                        defaultValue={offer.date_of_delivery}
                                                        {...register("date_of_delivery", {
                                                            required: true,
                                                            pattern: /[0-9]/,
                                                        })}
                                                    />
                                                    {errors?.date_of_delivery?.type === "required" &&
                                                        <p>Bu alan zorunludur.</p>}
                                                    {errors?.date_of_delivery?.type === "pattern" && <p>Lütfen sayısal bir değer giriniz.</p>}
                                                </td>

Does this answer your question? [input pattern='\[a-zA-Z\]' is not working in React application](https://stackoverflow.com/questions/48233264/input-pattern-a-za-z-is-not-working-in-react-application) — Ghazi, Jul 25 '22 at 12:38

score 1 · Accepted Answer · answered Jul 28 '22 at 10:01

<td>
                                                    <input
                                                        type="text"
                                                        className="form-control text-uppercase"
                                                        id="date_of_delivery"
                                                        name="date_of_delivery"
                                                        defaultValue={offer.date_of_delivery}
                                                        {...register("date_of_delivery", {
                                                            required: true,
                                                           pattern: /^[0-9]{11}$/,
                                                        })}
                                                    />
                                                    {errors?.date_of_delivery?.type=== "required" &&<p>Bu alan zorunludur.</p>}
{errors?.date_of_delivery?.type === "pattern" && <p>Lütfen sayısal bir değer  giriniz.</p>}
                                                </td>

React Hook Form Only Numeric Pattern

1 Answers1