Submit button is submitting the first form in the page - asp.net-mvc

Question

I am trying to make an MVC 5 Razor web page with a table within it, Every row in this table contains a Delete button which is post action:
<table>
<thead>
<tr>
<th>Name</th>
.
.
.
<th>Actions</th>
</tr>
</thead>
<tbody>
#foreach(var item in Model)
{
<tr>
<td>#item.Name</td>
.
.
.
<td>
#using(Html.BeginForm("Delete", "Person", FormMethod.Post))
{
#html.AntiForgetyToken()
#html.Hidden("personId", item.PersonId)
<button type="submit" class="btn">Delete</button>
}
</td>
</tr>
}
</tbody>
</table>
And in the controller:
public class PersonController : BaseController
{
[HttpPost, ValidateAntiForgeryToken]
public ActionResult Delete(int personId)
{
// Do Something...
}
}
Now my problem is when pressing Delete button in any row of the table it always submitting the first form in the page which means the first person in the table is always being deleted no matter what submit button i press.
Any ideas to solve this issue?
Edit:
The generated page html
<div class="page-header">
<h2>Person List</h2>
</div>
<table class="row table table-striped">
<thead>
<tr class="text-primary">
<th class="text-center">#</th>
<th>Name</th>
<th>Email</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center">5</td>
<td>Ismail</td>
<td>ismail#example.com</td>
<td>Active</td>
<td>
<form action="/WebApp/Person/Delete?PersonID=5" method="post">
<input name="__RequestVerificationToken" type="hidden" value="Uxhp0Bq1ATAwOXNODHmc74f12O2-dvFhQ5kletbmDkq64CEPWZlXXPKuHDoqSy4DXF6mJhYfGffc_YAn1yERxp69JCUT9IlGTKdfirvVvqE1" />
<div class="text-center">
<div class="btn-group btn-group-xs">
<a class="btn btn-default" href="/WebApp/Person/Details?PersonID=5">View</a>
<a class="btn btn-default" href="/WebApp/Person/Edit?PersonID=5">Edit</a>
<button class="btn btn-danger>Delete</button>
</div>
</div>
</form>
</td>
</tr>
<tr>
<td class="text-center">6</td>
<td>MoHaKa</td>
<td>MoHaKa#example.com</td>
<td>Active</td>
<td>
<form action="/WebApp/Person/Delete?PersonID=6" method="post">
<input name="__RequestVerificationToken" type="hidden" value="R4CUAuVpbGihZvrFxxCjCL_oJ7tgkS_Xxh67i_xCpMXpvZKR5ASUWrSCvjg52yRorF-Ypeau1oZwDi96caHyUj-gmBeHnx7NBgfJBLkLPnQ1" />
<div class="text-center">
<div class="btn-group btn-group-xs">
<a class="btn btn-default" href="/WebApp/Person/Details?PersonID=6">View</a>
<a class="btn btn-default" href="/WebApp/Person/Edit?PersonID=6">Edit</a>
<button class="btn btn-danger>Delete</button>
</div>
</div>
</form>
</td>
</tr>
</tbody>
</table>

Answer 1

Use this instead of your form code:
#using(Html.BeginForm("Delete", "Person", new { item.PersonId }))
{
#Html.AntiForgetyToken()
<button class="btn">Delete</button>
}
ASP.NET MVC default action behavior: primitive types are first looked in query string.

Answer 2

Maybe it's better to use just one form and add a cell like this instead of several forms:
<td onclick="window.location='#Url.Action("Delete", new { PersonID = item.PersonId })'" style="cursor:pointer;">
</td>