將jQuery UI對話框傳遞給彈出窗口

我一直在使用Visual Studio在MCV 3中創建視頻遊戲網站，並且無法確定如何將ID從我的頁面傳遞到彈出對話框以顯示來自我的正確開發人員數據庫。將jQuery UI對話框傳遞給彈出窗口

我現在要做的頁面是我的DeveloperManager頁面，我用它來做基本的CRUD，我試圖做的功能是當我點擊刪除鏈接打開一個對話框，詢問是否確認上述開發人員應該被刪除，然後刪除它。

我已經有一個頁面調用DeveloperManager /刪除，如果我只是點擊此刻正在通過item.DeveloperID，並提出正確的開發和確認時刪除它。但出於方便，我想在對話框中打開該頁面。

正如你將會看到的，我已經設法打開一個對話框，當我點擊創建新按鈕但不使用參數只是打開頁面創建一個開發人員並關閉它。

下面是該DeveloperManager頁

@model IEnumerable<ReviewSite.Models.Developer> 

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Developers</h2> 

<p> 
    @Html.ActionLink("Games","Index","GameManager") 
    @Html.ActionLink("Developers","Index","DeveloperManager") 
    @Html.ActionLink("Publishers","Index","PublisherManager") 
    @Html.ActionLink("Genres","Index","GenreManager") 
</p> 

<button id="createLink">Create New</button> 

<table> 
    <tr> 
     <th> 
      Developer Name 
     </th> 
     <th> 
      Developer URL 
     </th> 
    </tr> 

    @foreach (var item in Model) 
    { 
     <tr> 
      <td> 
       <span class = "DeveloperName" >@Html.DisplayFor(modelItem => item.DeveloperName)</span> 
      </td> 
      <td> 
       <span class = "DeveloperURL" >@Html.DisplayFor(modelItem => item.DeveloperURL)</span> 
      </td> 
      <td> 
       @Html.ActionLink("Edit", "Edit", new { id = item.DeveloperID }, new { id = "editLink" }) | 
       @Html.ActionLink("Details", "Details", new { id=item.DeveloperID }) | 
       @Html.ActionLink("Delete", "Delete", new { id = item.DeveloperID}, new { @class = "deleteLink"}) 
      </td> 
     </tr> 
    } 

    </table> 


<script type="text/javascript"> 
    $(document).ready(function() { 
     var $createDialog = $('<div></div>') 
     .load('/DeveloperManager/Create') 
     .dialog({ 
      autoOpen: false, 
      title: 'Create Developer', 
      modal: true 
     }); 
     $('#createLink').click(function() { 
      $createDialog.dialog('open'); 

      return false; 
     }); 
    }); 
</script>

的代碼，當我點擊刪除它調用此頁到對話框

@model ReviewSite.Models.Developer 

@{ 
ViewBag.Title = "Delete"; 
} 

<h2>Delete</h2> 

<p> 
@Html.ActionLink("Games","Index","GameManager") 
@Html.ActionLink("Developers","Index","DeveloperManager") 
@Html.ActionLink("Publishers","Index","PublisherManager") 
@Html.ActionLink("Genres","Index","GenreManager") 
</p> 

<h3>Are you sure you want to delete @Model.DeveloperName?</h3> 
<fieldset> 
<legend>Developer</legend> 

<div class="display-label">Developer Name</div> 
<div class="display-field"> 
    @Html.DisplayFor(model => model.DeveloperName) 
</div> 

<div class="display-label">DeveloperURL</div> 
<div class="display-field"> 
    @Html.DisplayFor(model => model.DeveloperURL) 
</div> 

</fieldset> 
@using (Html.BeginForm()) { 
<p> 
    <input type="submit" value="Delete" /> | 
    @Html.ActionLink("Back to List", "Index") 
</p> 
}

來源

2012-06-24 DaveManchap

http://jsfiddle.net/umwMU/6/

分配item.DeveloperID到一個屬性鏈接。

@Html.ActionLink("Delete", "Delete", new { id = item.DeveloperID}, new { @class = "deleteLink", @devid = item.DeveloperID })

加載該對話框的HTML時，然後使用該ID的查詢字符串。

$('.deleteLink').click(function(evt) { 
    evt.preventDefault(); 

    var developerID = $(this).attr("devid"); 

    var url = '/DeveloperManager/Delete/' + developerID; 
    var $deleteDialog = $('#deleteDialog').load(url, function() { 
     $deleteDialog.dialog({ 
      autoOpen: true, 
      title: 'Delete Developer', 
      modal: true 
     }); 
    }); 
});

來源

2012-06-30 16:23:14 Bill

將jQuery UI對話框傳遞給彈出窗口

回答

相關問題