Error: Invalid ObjectId

I will be glad if help. I created a form input for a staff, where i hope to receive their Staff_Id. now when i pass the id Directly to:
let user = await User.findById({"_id": new ObjectId(staff)});
I SEE THE USER AND ALL THE DETAILS. But when I pass the Staff_Id from the form input i receive:

Error: Invalid ObjectId: "61264adf0db85f01c0900c8c"

note: the body is parsing the staff_Id just when search it return the above error.


SERVER.JS
app.route("/leave-req").post(async (req, res, next) => {
    const {staff} = req.body;
    
   try{
      let user = await User.findById({"_id": new ObjectId(staff)});
        console.log("search found", user);
        res.json({"search found ": user});
    }catch(e){
      next(e)
    } 
   
  });
  

PROFILE.PUG


success: Connected

html

  head

    title nanas personal portfolio

    meta(name='description', content='Profile')

    meta(charset='utf-8')

    meta(http-equiv='X-UA-Compatible', content='IE=edge')

    meta(name='viewport', content='width=device-width, initial-scale=1')

    link(rel='stylesheet', href='/public/style.css')

  body

    h1.border.center posting select option

    form(action="/leave-req" method="post")

      div.staff-name

        label(for="staff") staff name

        br

        input(type="text", id="staff", name="staff")

        br

        br

      label(for="manager") choose manager

      div.managers

        select(name="manager", id="manager")

          option(selected, disabled) Select a Manager

          option(value="wakidoor@gmail.com", name="wakidoor@gmail.com")  firstMngr

          option(value="secMngr", name="secMngr")      secMngr

          option(value="thirdMngr", name="thirdMngr")  thirdMngr

          option(value="fouthMngr", name="fouthMngr")  fouthMngr

          br

      div.text-field

        textarea(type="text", id="message" name="message")

        br

        input(type="submit" value="submit")


Now how can i convert that to a valid id
not: it is 24 bytes