title: How to delete the item on the click of the button in every item?
body: <p>I'm new to Html and ASP.Net MVC. <br/>
  I want to make the view looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/0tYGi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0tYGi.png" alt="One item one delete button"></a></p>
  
  <p><strong>each item will be deleted when each button is on click</strong></p>
  
  <p>And here are my simple codes</p>
  
  <pre><code>@using ControllerPractice.Models
  @model IEnumerable&lt;Table&gt;
  
  @{
      ViewBag.Title = "Index";
  }
  
  &lt;h2&gt;Index , Data amounts @Model.Count()&lt;/h2&gt;
  &lt;ul&gt;
      @foreach (var t in Model)
      {
          &lt;li&gt;&lt;h2&gt;@t.Title&lt;/h2&gt;&lt;/li&gt;
          &lt;li&gt;@t.Text&lt;/li&gt;
          using (Html.BeginForm("Delete", "Home"))
          {
              &lt;input type="hidden" name="Id" value=@t.Id /&gt;
              &lt;input type="submit" value="Delete" /&gt;
          }
      }
  &lt;/ul&gt;
  
  
  &lt;div&gt;
      @using (Html.BeginForm("Post", "Home"))
      {
          &lt;p&gt;
              Title: &lt;input type="text" name="Title"&gt;
              Content: &lt;input type="text" name="Text"&gt;
              &lt;input type="submit" value="Submit"&gt;
          &lt;/p&gt;
      }
  &lt;/div&gt;
  &lt;div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>and my <strong>API</strong></p>
  
  <pre><code>[HttpPost]
          public ActionResult Delete(int? Id)
          {
              db.Table.Remove(db.Table.Find(Id));
              db.SaveChanges();
              return View("Index", db.Table.ToList());
          }
  </code></pre>
  
  <blockquote>
    <p><strong>I'm wondering is there any better solution instead of using  &lt;input type="hidden" / &gt;</strong> ? <br/>
    <strong>Or how to put the form outside of the 'ul' tag ?</strong><br/>
    <strong>Please improve my codes , thanks</strong>.</p>
  </blockquote>