Delete button does not work

[rbtsv]

            <DropdownMenuItem>
              <form action={deleteProduct}>
                <button type="submit">Delete</button>
              </form>
            </DropdownMenuItem>

The delete button from dropdown menu does not work. A click on the button does not invoke the submit event (I used () => {alert("test");} instead of deleteProduct as well). I had to use onClick method to make things work.

[tehtipsy]

you can add a hidden input field inside the form with the id from the product provided to the component.

         
           // product.tsx
           import { deleteProduct } from './actions';

           // ...
             <DropdownMenuItem>
               <form action={deleteProduct}>
                 <input type="hidden" name="id" value={product.id} />
                 <button>
                    Delete
                 </button>
               </form>
           </DropdownMenuItem>
   
           
           // actions.ts
           "use server";
           
           export async function deleteProduct (formData: FormData) {
             let id = Number(formData.get('id')); // key is set by the input field "name" attribute
             await deleteProductById(id);
             revalidatePath('/');
           }

[rbtsv]

But how will it fix that the submit event does not work? Currently I have solved this problem via onClick event, but it is definitely a bug)