Skip to content
Loading
Delete using Partial  
  •                                                       
  •                                                   
  •                                               
  •                                         }  
  •  Note:- I am using ViewBag.Id and Modal Id is simple DeleteModal
     
    step 2.  Remove the data toggle from anchor tag and use data-Id
    1. @if (item.IsActive)  
    2.                                        {  
    3.                                            btnDelete class="btn btn-danger  btn-sm btnDelete" data-Id="@item.Id" style='margin-left:5px'>class='fa fa-trash'> Delete   
    4.                                        }  
    5.                                        else  
    6.                                        {  
    7.                                            class='btn btn-danger btn-sm disabled' id='btnDelete' style='margin-left:5px'>class='fa fa-trash'> Delete   
    8.                                        }  
     
     step 3. create one method to return the above partial view.
    1. public ActionResult DeletePartial(int Id)  
    2. {  
    3. ViewBag.Id= Id;  
    4. return PartialView("_DeletePartial");  
    5.   
    6. }  
    step 4. On delete click first call the partial view then open the modal popup.
     Note:- myDiv in the below code is just a blank div anywhere in the view.
     
    1. $(".btnDelete").click(function(){  
    2. int Id= $(this).attr("data-Id");  
    3. $.Post("/Controller/DeletePartial?Id="+Id,function(data){  
    4. $("#myDiv").html(data);  
    5.   
    6. })  
    7. $("#DeleteModel").Modal('Open');  
    8. });  
    +2
  • Hi Arnab
     
       Is it possible to use the code for all Delete in different controllers.
    don't want to write for each Controller Delete method
     
    Thanks 
    +1
  • Arnab Mukherjee
    Action
    1. // GET: EmployeeController/Delete/5  
    2. public async Task Delete(int id)  
    3. {  
    4.     Employee objEmp = new Employee();  
    5.     EmployeeViewModel objViewModel = new EmployeeViewModel();  
    6.     if (id > 0)  
    7.     {  
    8.         objEmp = await _empRepo.Get(id);  
    9.         objViewModel.EmpName = objEmp.EmpName;  
    10.     }  
    11.     return PartialView("_Delete", objViewModel);  
    12. }  
    13.   
    14. // POST: EmployeeController/Delete/5  
    15. [HttpPost]  
    16. [ValidateAntiForgeryToken]  
    17. public async Task Delete(int id, EmployeeViewModel collection)  
    18. {  
    19.     int result = 0;  
    20.     Employee objEmp = new Employee();  
    21.     EmployeeViewModel objViewModel = new EmployeeViewModel();  
    22.     try  
    23.     {  
    24.         if (id> 0)  
    25.         {  
    26.             objEmp = await _empRepo.Get(id);  
    27.             if (!objEmp.IsDeleted)  
    28.             {  
    29.                 result = await _empRepo.Delete(objEmp);  
    30.                 if (result > 0)  
    31.                 {  
    32.                     ViewBag.Alert = CommonServices.ShowAlert(Alerts.Success, "Record Deleted");  
    33.                 }  
    34.                 else  
    35.                     ViewBag.Alert = CommonServices.ShowAlert(Alerts.Danger, "Unknown error");  
    36.             }  
    37.         }                 
    38.         return RedirectToAction(nameof(Index), new { alert = ViewBag.Alert });                
    39.     }  
    40.     catch (Exception ex)  
    41.     {  
    42.         return View();  
    43.     }  
    44. }  
    PartialView 
    1. @model Sample_Code.Models.EmployeeViewModel  
    2. @{  
    3.     ViewData["Title"] = "Delete";  
    4.     //Layout = "~/Views/Shared/_Layout.cshtml";  
    5. }  
    6.   
    7.   
    8.   
    9. <div class="modal-content">  
    10.       
    11.     <div class="modal-header">  
    12.         <h4 class="modal-title">Edit Employeeh4>  
    13.         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×span>button>  
    14.     div>  
    15.       
    16.     <div class="container">  
    17.         <form asp-controller="Employee" asp-action="Delete" method="post">         
    18.             <div class="modal-body form-horizontal">  
    19.                 Are you want to delete @Model.EmpName ?  
    20.             div>  
    21.             <div class="form-group">  
    22.                 @Html.Raw(@ViewBag.Alert)  
    23.             div>  
    24.               
    25.             <div class="modal-footer">  
    26.                 <button data-dismiss="modal" id="cancel" class="btn btn-default" type="button">Cancelbutton>  
    27.                 <button class="btn btn-success relative" id="btnSubmit" type="submit">  
    28.                     <i class="loader">i>  
    29.                     Submit  
    30.                 button>  
    31.             div>  
    32.               
    33.             @*<div class="form-group">  
    34.                     <input type="submit" value="Save" class="btn btn-primary" />  
    35.                 div>*@  
    36.         form>  
    37.     div>  
    38.   
    39. div>  
     JavaScript: 
     
    https://github.com/ArnabMSDN/ASP.NET-Core-Sample/blob/main/Sample-Code/Sample-Code/wwwroot/js/site.js
    +2
  • Hi Sachin

     

       Can u pls Help with Code. 

     

    Thanks 

    +1
  • Sachin Singh
    partial view inside foreach loop doesn't make sense. I will say it is wrong.
    you should call the partial view on delete click using ajax.
    +1