Suppression de l'utilisation d'Entity Framework et de la méthode du contrôleur d'appel dans ajax

Question

J'ai essayé de créer un bouton de suppression dans mvc en utilisant json pour appeler la méthode delete dans mon contrôleur, mais jusqu'à présent cela ne fonctionne pas.

J'ai fait piéger l'alerte d'erreur dans le script et la section de succès n'enregistre rien, j'ai besoin d'aide bien ici est mon point de vue, qui choisit des données de SQL Server en utilisant Entity Framework 5.1. Je travaille avec une table appelée Departments et elle a deux colonnes, DepartmentId et DepartmentName.

<div class="container" style="width:40%; margin-top:2%;"> 
    <hr /> 
    <table class="table-responsive"> 
     <tr> 
      <th>Deprtment Name</th> 
      <th></th> 
     </tr> 
     <tbody> 
     @if(ViewBag.RowDepartmentList != null) 
     { 
      foreach(var item in ViewBag.RowDepartmentList) 
      { 
       <tr id="row_@item.DepartmentId"> 
        <td>@item.DepartmentId</td> 
        <td>@item.DepartmentName</td> 
        <td><a href="#" class="btn btn-danger" onclick="ConfirmDelete(@item.DepartmentId)"> 
         <i class="glyphicon glyphicon-trash"></i></a></td> 
       </tr> 
      } 
     } 
     </tbody> 
    </table> 
    <input type="hidden" id="HiddenDepartmentId" /> 
</div> 

J'ai ajouté un attribut caché pour capturer l'DepartmentId, la forme a aussi un bouton de suppression qui appelle d'abord une boîte de dialogue modale de suppression.

Mon DELETE code de dialogue modale:

<div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-hidden="true"> 
<div class="modal-dialog" style="width:350px;"> 
    <div class="modal-content"> 
     <div class=" modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="close"> 
       <span aria-hidden="true">x</span> 
      </button> 
      <h3 class="modal-title">Delete record</h3> 
     </div> 
     <div class="modal-body"> 
      <h4>Are you sure you want to delete this?</h4> 
     </div> 
     <div class="modal-footer"> 
      <a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a> 
      <a href="#" class="btn btn-success" onclick="DelDepartment()">Delete</a> 
     </div> 

    </div> 
</div> 

Et voici ce que mon contrôleur ressemble à:

public class EmployeeController : Controller 
{ 
    // GET: Employee 
    public ActionResult DepartmentIndex() 
    { 
     MVCTutorialEntities2 db = new MVCTutorialEntities2(); 

     List<EmployeeViewModel> emlist = db.Departments.Where(x => x.IsDeleted == 0).Select(x => new EmployeeViewModel {DepartmentId=x.Departmentid, DepartmentName = x.DepartmentName }).ToList(); 

     ViewBag.RowDepartmentList = emlist; 

     return View(); 
    } 

    // the delete function 
    [HttpPost] 
    public JsonResult DelDepartment(int depId) 
    { 
     MVCTutorialEntities2 db = new MVCTutorialEntities2(); 
     bool result = false; 
     Department dep = db.Departments.SingleOrDefault(x => x.Departmentid == depId); 

     if (dep != null) 
     { 
      db.Departments.Remove(dep);  // I don't know why this is not deleting .... the table is not cascaded 
      db.SaveChanges(); 

      result = true; 
     } 

     return Json(result, JsonRequestBehavior.AllowGet); 
    } 
} 

// now my script is all here that calls the  
<script> 
var ConfirmDelete = function (DepartmentId) { 
    $("#HiddenDepartmentId").val(DepartmentId); 
    $("#mymodal").modal("show"); 
} 

var DelDepartment = function() 
{ 
    var depId = $("#HiddenDepartmentId").val(); 

    $.ajax({ 
     type: 'POST', 
     url: 'Employee/DelDepartment', 
     data: { DepartmentId: depId }, 

     success: function (result) {$("#mymodal").modal("hide"); }, 
     error: function (result) { alert(result); $("#mymodal").modal("hide"); } // only the error section resturns a message of [object] of [object] 
    }); 
} 
</script> 

Essayer si difficile d'apprendre cette langue ... et si oui, est-il façon dont je peux simplement utiliser le rasoir et appelez la fonction de suppression de la

fonction?

Answer 1

données: {departmentId: depid} doit être

données: {depid: depid} parce que le nom du paramètre JS gauche doit correspondre avec le nom du paramètre du côté du contrôleur.

Ou vous devrez peut-être faire: des données: JSON.stringify ({depid: depid})

Si cela ne fonctionne pas, vous pouvez faire url:? Employé/DelDepartment depid = '+ deptId et juste se débarrasser de la propriété de données tout à fait.