CODEWITHSUNDEEP
jquery
st78
st78

Reputation: 8316

$(document).ready() not executed for ajax loaded content

What could be reasons not to execute document.ready within returned partial page? It works fine 2 times, but on 3rd time nothing happens after update of html:

alert(html);
alert($(PopUpItem));
$(PopUpItem).html(html);
alert('in set popup html completed');

I have all alerts executed, PopupItem and html has correct values. I am using JQuery to execute server call by $.post.

Also, Can I have error handler to catch if some syntax error happened?

Upvotes: 7

Views: 18120

Answers (4)

bobince
bobince

Reputation: 536349

Are you saying that the html string passed to $(PopUpItem).html() contains a <script> block with a document.ready(function() { ... }); inside it?

If so the reason the ready event handler doesn't fire is that the script doesn't run at all. See this question which has the same ‘third-time’ behaviour.

Don't load <script> tags into markup. It's not at all reliable cross-browser, jQuery or no jQuery.

Upvotes: 2

efi
efi

Reputation: 162

To bind events to any asynchroneously generated elements you should take a look on livequery: http://docs.jquery.com/Plugins/livequery

Upvotes: 0

Keith Rousseau
Keith Rousseau

Reputation: 4475

document.ready is only executed when the page is originally loaded.

In order to have an error handler, you can use the more $.ajax to do your ajax calls (http://api.jquery.com/jQuery.ajax/).

Upvotes: 1

tambler
tambler

Reputation: 3039

Within your returned AJAX, you shouldn't need a $(document).ready() call. The DOM has already been loaded. Something simple like this should do the trick:

<script type="text/javascript">
// Do something here.
</script>

Upvotes: 13

Related Questions