Why is my EJS variable returning "undefined" when i'm trying to use the mongoose "findByIdAndRemove" method

I'm trying to delete records from a mongoDB database on the event of the click of a button. But when I console log the value of this button it is returning "undefined"

Below is the ejs file

<%- include("partials/header") -%>

<h1>Home</h1>

<!-- A variable for the homepage that is populated by a body of text passed from app.js -->
<p><%= homeText %> </p>

<a class= "btn btn-primary" href="/compose" role="button">Compose a new post</a>

<%# A forEach method with a function holding a parameter of "post" which represents an element in an array, then displaying the element's title and content. %>
<% homeContent.forEach(function(post){ %>
<h1><%= post.title %></h1>
<!-- Displays only the first 100 characters of a post as well as a "read more" hyperlink which directs to a "post" page containing the full content of the post. -->
<p><%= post.content.substring(0, 100) + " ... " %> <a href="/post/<%=post._id %>">Read more</a></p>

<form action = "/delete", method="Post">
  <button type="button" class ="btn btn-link" name = "deleteButton" value = "<%=post._id%>" onClick="this.form.submit()"  ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-trash" viewBox="0 0 16 16">
  <path d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z"/>
  <path fill-rule="evenodd" d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4L4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z"/>
</svg> </button>   %>

  </form>


<%});%>



<%- include("partials/footer") -%>

And here is the method i'm trying to call for my delete function within my app.js (server file)

app.post("/delete", function(req,res){
  const selectedId = req.body.deleteButton;

  Post.findByIdAndRemove(selectedId, function(err){
    if(!err){
      console.log(selectedId);
      res.redirect("/");
    }
  })
});

When I console log the ID variable it's clear that it's not correctly accessing the ID of the post from the EJS file as it returns "undefined", so nothing is getting deleted. Is there anything obvious i'm missing here? I'm quite new to MongoDB and NodeJS, I have searched around for some answers but can't seem to identify what is syntactically wrong with what I have written. Feel free to let me know if you need any more of my code etc, thank you in advance!