エンティティフレームワークを使用して削除し、ajaxでコントローラメソッドを呼び出す

Question

mvcでjsonを使用して削除ボタンを作成しようとしましたが、コントローラのdeleteメソッドを呼び出せませんでした。

スクリプトでエラーアラートをトラップしましたが、成功セクションでは何も登録されていませんでした。ここでは、Entity Framework 5.1を使用してSQL Serverからデータを選ぶ私のビューです。

私はDepartmentsというテーブルで作業しており、2つのカラム、DepartmentIdと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> 

私は、フォームがあまりにも最初の削除ダイアログをモーダルに呼び出す削除ボタンがあり、DepartmentIdをキャプチャするために隠し属性を追加しました。

マイDELETEダイアログモーダルコード：

<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> 

そして、これは私のコントローラは、次のようになります。この言語を学ぶために一生懸命しようと

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> 

は...そうであれば、いずれかがあります私はちょうどかみそりを使用してから削除機能を呼び出すことができます

@using (Html.BeginForm("", "",FormMethod.POST)) ? 

機能？

Answer 1

データ：左JSパラメータ名は、コントローラ側のパラメータ名と一致する必要があるため：{depId depId：} {DepartmentIdの：depIdは}

データである必要があります。

それとも、実行する必要があります。データ：JSON.stringify（{depId：depId}）

問題が解決しない場合は、URLの操作を行うことができます '？員/ DelDepartment depId =' + DEPTIDとちょうどデータプロパティを完全に取り除いてください。