最簡單的方法來顯示從ASP.NET GridView的jQuery彈出詳細信息頁

Question

我有一個C＃Asp.net Gridview的一些數據，然後有一個數據的每一行的詳細信息頁面，用超鏈接來查看詳細信息頁面。點擊任何特定數據行的「顯示詳細信息」後，使用jquery模式框顯示彈出窗口的最佳（最簡單）方法是什麼？

因此，例如在網頁「details.aspx？ID = 10012」點擊「顯示詳細信息」超級鏈接

Answer 1

在那裏我傳遞CustomerID作爲查詢字符串到

另一個頁面的一個例子之後會彈出一個模式對話框

第1步 - 像這樣在頁面中創建ItemTemplate。

<ItemTemplate> 
    <asp:HyperLink ID="DetailsLink" runat="server" 
     CssClass="my_link" 
     Text="View Details" 
     ToolTip='<%# Eval("CustomerID") %>' 
     NavigateUrl="#"> 
    </asp:HyperLink> 
</ItemTemplate> 

第2步 - 在GridView外面放置一個div，像這樣。

<div id="dialog"> 
    <iframe id="myIframe" src=""></iframe> 
</div> 

步驟3 - JS

$(document).ready(function() { 
    $("#dialog").dialog({ 
     autoOpen: false, 
     modal: true, 
     height: 600, 
     open: function (ev, ui) { 
      $('#myIframe').attr('src', 'Popup.aspx?id=' + selectedID); 
     } 
    }); 
    var selectedID = "0"; 
    $('.my_link').click(function (event) { 
     selectedID = this.title; 
     event.preventDefault(); 
     $('#dialog').dialog('open'); 
    }); 
}); 

代碼是自解釋的。希望這可以幫助。