jquery problem with anchor click() method
Among other things I have this html content in my content page:
<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
$("[ID$=panelDetail]").dialog({
autoOpen: false
, resizable: false
, height: 'auto'
, width: 'auto'
, modal: true
, overlay: { opacity: 0.8, background: "black" }
});
function loadDialog(action) {
$("[ID$=panelDetail]").dialog('open');
$.ajax({
type: "POST",
dataType: "HTML",
url: action,
data: {},
success: function(response) {
$("#panelDetail").html('');
$("#panelDetail").html(response);
}
});
}
$("[ID$=btnAdd]").click(function() {
alert("click on add");
loadDialog("/Foro/Create", "");
});
</script>
</asp:Content>
I have then this HTML fragments in two separated sections
<asp:Content ID="Content1" ContentPlaceHolderID="BodyContent" runat="server">
<div id="panelDetail" style="display:none" title="Panel Title">&开发者_如何学Pythonlt;/div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="RightPanel" runat="server">
<a href="#" id="btnAdd">Add new</a>
<a href="#" id="btnEdit">Edit</a>
</asp:Content>
Why the alert inside the tag does never get called???
Thanks for helping!
You need to wrap your calls in a document.ready
call, like this:
$(function() {
$("a[ID$=btnAdd]").click(function() {
alert("click on add");
loadDialog("/Foro/Create", "");
});
});
Otherwise the elements aren't there to be found yet :) document.ready
handlers fire when the DOm's fully loaded, e.g. your links are there to be found.
In the case of UpatePanels, switch to .live()
, like this:
$(function() {
$("a[ID$=btnAdd]").live('click', function() {
alert("click on add");
loadDialog("/Foro/Create", "");
});
});
精彩评论