Error message is not showing in select option

[MejanH]

error message is not working in select html tag. am i missing something? or is there a feature missing?

<select name="Title" ref={register({ required: "Select Title is required" })} > <option value="Mr">Mr</option> <option value="Mrs">Mrs</option> <option value="Miss">Miss</option> <option value="Dr">Dr</option> </select> {errors.Title && <p>{errors.Title.message}</p>}

[bluebill1049]

you default selection is always: <option value="Mr">Mr</option>

you will need an empty selection item <option value="">Select...</option>

[MejanH]

<select
                  name="category"
                  value={post.category} ref={register({ required: "Select Title is required" })}
                  onChange={handleChange}
                  className="block appearance-none w-full bg-white border border-gray-400 hover:border-gray-500 px-4 py-2 pr-8 rounded shadow leading-tight focus:outline-none focus:shadow-outline"
                >
                  <option defaultValue hidden>
                    Choose Category
                  </option>
                  {categories.map((category) => {
                    return (
                      <option key={category._id} value={category._id}>
                        {category.title}
                      </option>
                    );
                  })}
                </select>

This is my original code. i used default value there.

[bluebill1049]

import React from "react";
import { useForm } from "react-hook-form";

export default function App() {
  const { register, handleSubmit } = useForm();
  const onSubmit = data => console.log(data);
   
  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input name="firstName" ref={register({ required: true })} />
      <select name="gender" ref={register}>
        <option value="">Select</option>
        <option value="male">male</option>
        <option value="female">female</option>
      </select>
      <input type="submit" />
    </form>
  );
}

look the select above.

[MejanH]

Thanks it worked. and sorry i didn't get it first time. i though its not working because of mapping array.

[bluebill1049]

all good 👍