MVC Actionlink&Bootstrap Modal提交

Question

我正在开发一个MVC 5 Web应用程序.在我的一个Razor Views中,我有一个表格可以输出几行数据.在每行数据旁边是一个删除按钮.当用户单击删除按钮时,我想要弹出Bootstrap模式,并要求用户确认删除.

@foreach (var item in Model.Data) {
<tr>
 <td>...</td>
 <td>@Html.ActionLink("Delete", "Delete", new { id = item.ID }, new { @class = "btn btn-danger btn-xs", data_toggle = "modal", data_target = "#myModal" })</td>
</tr>
}

实际上,当用户单击"删除"按钮时,Modal弹出正常,但我似乎无法获取Actionlink参数中的ID以传递到我的模态中的"确认"按钮,以便它随后将被发送到删除我的控制器中的动作.

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
             <h4 class="modal-title" id="myModalLabel">Delete Nomination</h4>
         </div>
         <div class="modal-body">
           Are you sure you wish to delete this nomination?
         </div>
         <div class="modal-footer">
           <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
           <button type="button" id="mySubmit" class="btn btn-primary">Confirm</button>
         </div>
       </div>
      </div>
</div>

有人可以帮忙吗？

谢谢.

Answer 1

<script type="text/javascript">

    //Everytime we press delete in the table row
    $('.delete').click(function(e) {
        e.preventDefault();

        //Update the item to delete id so our model knows which one to delete
        var id = $(this).data('id');
        $('#item-to-delete').val(id);

    });


    //Everytime we press sumbit on the modal form...
    $('#mySubmit').click(function() {

        //Get the id to delete from the hidden field
        var id = $('#item-to-delete').val();


        //Call our delete actionresult and pass over this id
        $.post(@Url.Action("Delete", "Delete"), { id : id } , function (data) {

            alert("Deleted");

        });


    });

</script>

和你的HTML ...

@Html.Hidden("item-to-delete", "", new { @id = "item-to-delete"})
@foreach (var item in Model.Data) {
<tr>
    <td>...</td>

    <td><a href="" class="btn btn-danger btn-xs delete" data-toggle= "modal" data-target="#myModal" data-id="@item.id">Delete</a></td>

</tr>
}

我假设你的控制器动作是这样的......

public ActionResult Delete(Guid id)
{


}