Удалить запись, когда содержимое таблицы было изменено/удалено

Question

Im, используя следующий код для отображения данных таблицы на индексной странице, в настоящее время я создал delete inline, который пользователь нажимает на кнопку удаления, которую он получает всплывающее окно, чтобы подтвердить и нажать delete вызывает действие удаления, которое удаляет запись из БД. проблема после того, как я удалил ее из БД, я все еще вижу ее в пользовательском интерфейсе после того, как модальный был закрыт, сразу после того, как я обновил страницу, запись удалена, как я должен удалить запись из пользовательского интерфейса после ajax позвонить получить успех?

@model IEnumerable<TestropDownCreate.Models.TestModel> 

    @{ 
     ViewBag.Title = "Index"; 
    } 

    <h2>Index</h2> 
    <script src="~/Scripts/jquery-1.10.2.min.js"></script> 
    <!-- Modal --> 
    <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
        <h4 class="modal-title" id="deleteModalLabel">Delete Item</h4> 
       </div> 
       <div id="deleteModalBody" class="modal-body"></div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 

Delete 

    <p> 
     @Html.ActionLink("Create New", "Create") 
    </p> 
    <table class="table"> 
     <tr> 
      <th> 
       @Html.DisplayNameFor(model => model.Name) 
      </th> 
      <th> 
       @Html.DisplayNameFor(model => model.SelectedGender) 
      </th> 
      <th></th> 
     </tr> 

     @foreach (var item in Model) 
     { 
      <tr> 
       <td> 
        @Html.DisplayFor(modelItem => item.Name) 
       </td> 
       <td> 
        @Html.DisplayFor(modelItem => item.SelectedGender) 
       </td> 
       <td> 
        @Html.ActionLink("Edit", "Edit", new { id = item.ID }) | 
        @Html.ActionLink("Details", "Details", new { id = item.ID }) | 
        <a href="#" class="deleteLink" id="@item.ID">delete</a> 

       </td> 
      </tr> 
     } 

    </table> 


    <script> 
     $(function() { 
      $("#deleteModal").modal("hide"); // initially hides the modal pop-up until needed 

      $(".deleteLink").on("click", function() { 

       $.get('@Url.Action("GetDeletePartial")', { id: $(this).prop("id") }, function (data) { 
        $("#deleteModalBody").html(data); 

        $("#deleteModal").modal("show"); // shows the modal pop-up now that we have our partial view 
       }); 

      }); 
     }); 
$("#deleteBtn").on("click", function() { 
       $.ajax({ 
        type:'POST', 
        url: "/User/DeleteConfirmed", 
        dataType: "json", 
        data: {id: Id} , 
        success: function (result) { 
         var id = result; 

        }, 


       }); 

      }); 

     }); 
    </script> 

Answer 1

Причина заключается в том, что вы не обновите таблицу после удаления записи, эта проблема не связана с ASP ..., вы должны использовать JS/Jquery.

Дайте идентификатор строке таблицы.

<tr id="@item.ID"> 

И чем удалить удаляемой строки, когда завершите работу Устпешно

$("#deleteBtn").on("click", function() { 
       $.ajax({ 
        type:'POST', 
        url: "/User/DeleteConfirmed", 
        dataType: "json", 
        data: {id: Id} , 
        success: function (result) { 
         $('#' + id).remove(); 

}, });