title: ASP.NET MVC 5 Deleting Row in database using AJAX
body: <p>I am trying to delete rows in my table using Ajax so that the page does not refresh when I try to delete one row of the table.
  Here is the code I have, but at the moment pressing Delete does nothing:</p>
  
  <p>Controller:</p>
  
  <pre><code>public ActionResult Delete(int? id)
          {
              if (id == null)
              {
                  return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
              }
              Main main = db.Mains.Find(id);
              if (main == null)
              {
                  return HttpNotFound();
              }
              return View(main);
          }
  [HttpPost, ActionName("Delete")]
          public ActionResult DeleteConfirmed(int id)
          {
              Main main = db.Mains.Find(id);
              db.Mains.Remove(main);
              db.SaveChanges();
              return RedirectToAction("Index");
          }
  </code></pre>
  
  <p>The view:</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function () {
      $("#Delete").on("click", function () {
          var parent = $(this).parent().parent();
          $.ajax({
              type: "post",
              url: "@Url.Action("Delete","Main")",
              ajaxasync: true,
              success: function () {
                  alert("success");
              },
              error: function (data) {
                  alert(data.x);
              }
          });
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>The actual link to delete from the table:</p>
  
  <pre><code> &lt;td&gt;
        @Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
        &lt;a href="" id="Delete"&gt;Delete&lt;/a&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>Please help me! Ty</p>