在mvc3中單擊webgrid中的鏈接後的彈出窗口

我有一個webgrid，它在mvc3中有href鏈接。在mvc3中單擊webgrid中的鏈接後的彈出窗口

現在，當點擊一個鏈接，然後返回響應與服務器的一些記錄，我想要顯示在一個彈出窗口（數據將在服務器運行後，在控制器中運行一個新的查詢後單擊該鏈接，顯示在彈出窗口中）。

但我不想打開一個新窗口。我想在同一個瀏覽器頁面的彈出窗口中打開它。

我不知道他們使用jQuery或AJAX的天氣，但我想實現相同的功能。

請幫我達致這

在此先感謝

來源

2012-07-13 Vicky Kumar

你可以使用任何jQuery撐着它提供了彈出窗口來做到這一點。有幾個選項可用，如fancybox，SimpleModel，Colorbox，jQuery UI對話框，thickbox等。

這是您如何處理jQuery UI對話框。

步驟1） 包括jQuery的& jQuery用戶界面庫到您的網頁（或佈局頁）。您可以將您的本地副本引用到CDN的副本中。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />

步驟2） 在網格，給css類名稱的鏈接，使我們可以利用它來進行jQuery的選擇。在這裏，我給了一個CSS類popupLink

@Html.ActionLink("Scott", "Details", "Customers", 
       new { @Id = "someId" }, new { @class = "popupLink" })

步驟3） 現在讓jQuery UI的對話功能，與此特定CSS類這些鏈接

<script type="text/javascript"> 
$(function(){ 
    $(".popupLink").click(function (e) { 
     var url = this.href; 
     var dialog = $("#dialog"); 
     if ($("#dialog").length == 0) { 
      dialog = $('<div id="dialog" style="display:hidden"></div>').appendTo('body'); 
     } 
     dialog.load(
      url, 
      {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object 
      function (responseText, textStatus, XMLHttpRequest) { 
       dialog.dialog({      
        close: function (event, ui) {        
         dialog.remove(); 
        }, 
        modal: true,       
        width: 460, resizable: false 
       }); 
      } 
     );   
     return false;   
    }); 
}); 
</script>

所以每當這些鏈接的用戶點擊它將調用該鏈接的HREF屬性值（該操作方法）並獲取結果並顯示在彈出窗口中。

請確保您有動作的方法來處理這個請求

public ActionResult Details(string Id) 
{ 
    //do some dB query or whatever and return the result 

    return View(); // can return the Model here to the view. 

}

來源

2012-07-13 13:32:03 Shyju

在mvc3中單擊webgrid中的鏈接後的彈出窗口

回答

相關問題