Hello again Aaron, try this instead:
<script type="text/javascript">
$(document).ready(function(){
/*
This binds a callback to the click event of all
elements with the 'modal' class, even ones that are
updated inside an UpdatePanel.
*/
$(".modal").live('click', function(){
/*
When the element is clicked, open the nyroModal dialog
manually. (If the element is a link, nyroModal will
automatically get the content based on the link's href attribute.)
*/
$(this).nyroModalManual();
});
});
</script>
Edit
I've created a page that seems to work fine. The full source code is below.
Note: There's one important thing I didn't to in the code above. I forgot to prevent the link from actually changing the browser location, so note the evt.preventDefault(); in the code below (Sorry about that :P).
<%@ Page Language="C#" %>
<script runat="server">
public void Page_Load()
{
BindGridViewUrls();
}
public void GridViewUrls_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
GridViewUrls.PageIndex = e.NewPageIndex;
BindGridViewUrls();
}
public void BindGridViewUrls() {
var Urls = new[]{
new {UrlText="Google", Url="http://google.com"},
new {UrlText="Stack Overflow", Url="http://stackoverflow.com"},
new {UrlText="XKCD", Url="http://xkcd.com"},
new {UrlText="Google Reader", Url="http://google.com/reader"},
new {UrlText="reddit", Url="http://reddit.com"},
new {UrlText="Hacker News", Url="http://news.ycombinator.com"},
new {UrlText="Ubuntu", Url="http://ubuntu.com"},
new {UrlText="Twitter", Url="http://twitter.com"},
new {UrlText="YouTube", Url="http://youtube.com"},
new {UrlText="Wikipedia", Url="http://en.wikipedia.org"},
new {UrlText="Coding Horror", Url="http://codinghorror.com"},
new {UrlText="Mozilla", Url="http://mozilla.org"},
new {UrlText="jQuery", Url="http://jquery.com"},
new {UrlText="NyroModal", Url="http://nyromodal.nyrodev.com/"},
};
GridViewUrls.DataSource = Urls;
GridViewUrls.DataBind();
}
</script>
<!DOCTYPE
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>UpdatePanel Test</title>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script src="jquery.nyroModal-1.4.2.js"></script>
<script>
$(function(){
$('.modal').live('click', function(evt){
$(this).nyroModalManual({minWidth:750});
evt.preventDefault();
});
});
</script>
</head>
<body>
<form runat="server">
<div>
<asp:ScriptManager runat="server">
</asp:ScriptManager>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:GridView runat="server" ID="GridViewUrls" AllowPaging="true"
PageSize="5" OnPageIndexChanging="GridViewUrls_PageIndexChanging">
<Columns>
<asp:HyperLinkField DataTextField="UrlText"
DataNavigateUrlFields="Url" ControlStyle-CssClass="modal"
/>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>