ActionLink傳遞參數到Bootstrap模式

從頭開始，我在我的MVC5應用程序中有一個列表視圖。我有鏈接到「編輯」和「刪除」等操作。如果我點擊刪除，我想顯示Bootstrap Modal Popup，我已經有了。但問題是我有Html.ActionLink，它將我的Modal Popup重定向到我在ActionLink中指定的方法。我想只顯示彈出窗口，然後單擊提交或其他內容，然後執行操作。但還有一個問題 - 我可以通過什麼方式將參數從列表視圖傳遞到模態彈出窗口？ActionLink傳遞參數到Bootstrap模式

一些下面的代碼：

@model IEnumerable<SupportStudentSystem.Models.Category> 

@{ 
    ViewBag.Title = "List of Categories"; 
} 

<h1 class="text-center">Categories</h1> 

<div style="margin-top:1%"> 
    <a href="AddCategory" type="button" class="btn btn-lg btn-success"><i class="glyphicon glyphicon-plus"></i> Add Category</a> 
</div> 
<table class="table" style="margin-top:2%"> 
    <tr> 
     <th> 
      @Html.DisplayNameFor(model => model.CategoryName) 
     </th> 
     <th> 
      @Html.DisplayNameFor(model => model.Description) 
     </th> 
     <th> 
      @Html.DisplayNameFor(model => model.RequiredAge) 
     </th> 
     <th></th> 
    </tr> 

    @foreach (var item in Model) 
    { 
     <tr> 
      <td> 
       @Html.DisplayFor(modelItem => item.CategoryName) 
      </td> 
      <td> 
       @Html.DisplayFor(modelItem => item.Description) 
      </td> 
      <td> 
       @Html.DisplayFor(modelItem => item.RequiredAge) 
      </td> 
      <td> 
       @Html.ActionLink("Edit", "EditCategory", "Admin", new { item.CategoryID }, null) | 
       @Html.ActionLink("Delete", "DeleteCategory", "Admin", new { item.CategoryID }, new {data_toggle = "modal", data_target = "#Delete" })    </td> 
     </tr> 
    } 
</table>

這裏是我的模式：

<div class="modal active" id="Delete" role="dialog" style="overflow-y:auto"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
     <h3 style="text-align:center">Delete Category</h3> 
    </div> 
<div class="modal-body"> 
    <p style="text-align:center"><strong> Do you want to delete this category ? </strong> </p> 
</div> 
<div class="modal-footer"> 
    <button type="submit" onclick="location.href='@Url.Action("DeleteCategory", "Admin")'" class="btn btn-default">Delete category</button> 
    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
</div> 
</div>

在DeleteCategory方法我刪除已指定的類別ID通過像參數類別，然後從還刪除數據庫。

任何人都可以幫我解決這個問題嗎？

來源

2016-11-09 zari

如果你不介意使用jQuery，你可以爲onclick事件定義一個處理函數來捕獲你的刪除ActionLink的點擊。因此，在第一次給一個ID，你的ActionLink並存儲在數據屬性的參數：

@Html.ActionLink("Delete", "DeleteCategory", "Admin", new { item.CategoryID }, new {data_toggle = "modal", data_target = "#Delete", id="deleteActionLink", data_parameter="<here goes your parameter>" })

然後在jQuery代碼中加一個變量爲您的參數和事件處理程序：

var parameter; 
$("#deleteActionLink").on("click", function(){ 
    //save your parameter in variable 
    parameter = $("#deleteActionLink").data("parameter"); 
});

然後再添加一個處理程序，只爲您的模式提交按鈕，並從這裏發送一個post請求（使用ajax）

來源

2016-11-09 18:21:31 NamiraJV

我也試過Html.ActionLink和也，但似乎都沒有工作，我不知道爲什麼。我有這個ActionLink：'@ Html.ActionLink（「Usuń」，「DeleteCategory」，「Admin」，new {item.CategoryID}，new {data_toggle =「modal」，data_target =「#Delete」，id =「deleteActionLink」，data_parameter = @ item.CategoryID}）' and that jQuery function： 'var parameter; （「＃deleteActionLink」）。on（「click」，function（e）{ //將參數保存在變量中 parameter = $（「＃deleteActionLink」）。data（'id'）; $我不太確定，但是嘗試將這一行添加到點擊處理程序中： – zari

（「click」，function（event）{ //將參數保存在變量中 event.preventDefault（）; parameter = $（「＃deleteActionLink」）。data（「parameter」）; } ）;' 也許標準的ActionLink功能會干擾 – NamiraJV

嘗試將一個參數傳遞給你的處理程序$（「＃.data」）.val（parameter）; }）;' – NamiraJV

ActionLink傳遞參數到Bootstrap模式

回答

相關問題