0

このように定義さWebGridれた行の削除に使用されるリンクがあります-PartialView

@Html.ActionLink("Delete", "DeleteThis", "MyController", new { id = SelectedId }, null)
<div id="MyGrid">
@{
    var grid = new WebGrid(Model.ListOfStuff, canSort: true, ajaxUpdateContainerId: "MyGrid");   


    @grid.GetHtml()
}
</div>

グリッド上の項目が選択された後、ユーザーは「削除」リンクをクリックして、データベースから行を削除できます。

私の問題は、その呼び出しをAjax呼び出しにして、削除後にグリッドを更新したいということです。私の並べ替えは Ajax の方法で動作していますが、「削除」を Ajax で動作させる方法がわかりません。私のコントローラーコードは次のようになります-

    public ActionResult Index()
    {
        //CODE TO RETRIEVE THE MODEL

        return PartialView("Index", model);
    }

    public ActionResult DeleteThis(string id)
    {
        ////CODE TO DELETE RECORD

        return RedirectToAction("Index");  // I ALSO TRIED return PartialView("Index", model)         }

任意の洞察をいただければ幸いです。ありがとう！

4

1 に答える 1

0

リンクのクリック イベントをリッスンし、削除機能を実行するアクション メソッドへの ajax 呼び出しを行います。

メソッドが属性DeleteThisで装飾されていることを確認してください。HttpPost削除は常にHttpPostアクションである必要があります。GET アクションではありません。

[HttpPost]
public ActionResult DeleteThis(string id)
{
  try
  {
  // to do : delete
   return Json(new { Status="Deleted"});
  }
  catch(Exception ex)
  {
    //log the error
   return Json(new { Status="Error"});
  } 
}

Action メソッドから JSON を返します。post メソッドのコールバックで、Status プロパティの値をチェックして、削除操作が成功したかどうかを確認します。

$(function(){

  $("#SelectedId").click(function(e){
    e.preventDefault();

    var selectedItemId=34; // you need to get this from the grid;

    $.post("@Url.Action("DeleteThis","Home")/"+selectedItemId,function(data){
         if(data.Status="Deleted")
         {
          //reload the page or just reload the partial view as needed
          window.location.href=window.location.href;
          // $("#GridContainer").load(@Url.Action("List","Users")");
         }
    });

  });

});
于 2013-03-22T20:45:36.877 に答える