JQuery UI Dialog query dialog DOM

Question

The following simply loads a jquery-ui dialog from an external html file.

$('#showdialog').click(function(e) {
    var div = $('<div>loading...</div>');
    div.dialog({
        modal: true,
        open: function() { div.load('anotherpage.html'); }
    });
    e.preventDefault();
});

After the DOM loads from the external html file, I'd like to interrogate it with JQuery. For example, supposing anothorpage.html had a bunch of anchors on it, I'd like to wire up click handlers for them when it loads into the dialog.

Any ideas?

Oleg · Accepted Answer · 2010-05-13 19:28:21Z

3

You can define more then one parameter of jQuery.load (see http://api.jquery.com/load/) so after load is done you can do something:

div.load('anotherpage.html', function() {
  alert('Load was performed.');
});

place code which you need instead of alert.

answered May 13, 2010 at 19:28

Oleg

222k36 gold badges414 silver badges826 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ken Redler · Accepted Answer · 2010-05-13 19:30:26Z

1

Look into using .live() or .delegate(), which will allow you to attach handlers to events on elements within the dynamically loaded content.

For example:

$(document).ready( function() {
    $('div.yourDynamicContainer a').live('click', function() {
        doSomething()
    })
})

edited May 13, 2010 at 19:30

answered May 13, 2010 at 19:23

Ken Redler

23.9k8 gold badges60 silver badges69 bronze badges

Collectives™ on Stack Overflow

JQuery UI Dialog query dialog DOM

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related