Take the 2-minute tour ×

Populating a jQuery UI Dialog with a longish table, I would like to have it scroll to the last row in the table having a specific class. I found two other posts almost identical to this here, and here, but I can't get it to work. I've mocked it up at jsFiddle in the hope that someone might help me see the error in my thinking on it.

Here is the basic code

    jQuery(document).ready(function() {
    var content = jQuery('#amtz_div').html();
    var title = 'Amortization Schedule';
    var open = function() {
        var container = jQuery(".ui-dialog");
        var target = jQuery('tr.amortized:last');
        container.scrollTop(target.offset().top - container.offset().top + container.scrollTop());
        target.css('background', 'red');
    jQuery("#dialog").attr('title', title).html(content).dialog({
        modal: true,
        width: 400,
        height: 400,
        resizable: false,
        open: open

I also tried the scrollTo plugin (mentioned in one of the post linked above) but had now better luck with that.

Any thoughts?

share|improve this question
Any updates on this? –  EH_warch Jun 22 '12 at 20:45
add comment

1 Answer

i'm not sure if it's the new version of jQuery UI or that we have been away from this but changing the identifier from .ui-dialog to #dialog work in your case. I'm going to see if this works for me as well!


share|improve this answer
add comment

Your Answer


