Shishant
Shishant

Reputation: 9294

append data loaded problem

My html is like this

<div id="rsContainer">
        <table id="rsTable"><!-- DATA HERE --></table>
</div>

and my javascript is like this

$('#UpdateAll').click(function() {

        $('#status').fadeIn('500').text('Loading... This may take a while.');
        $.ajax({
        type: 'post',
        url: 'func.php',
        data: 'action=updateAll',

        success: function(response) {
            $('#response').fadeOut('500').fadeIn('500').append(response);

            $('#rsTable').slideUp('1000').load('index.php #rsTable', function() {
                $(this).appendTo('#rsContainer').slideDown('1000');
            });

            $('#status').fadeOut('500').empty();
        }
        });     
    });

This works fine and but after appening the html looks like this

<div id="rsContainer">
        <table id="rsTable">
            <table id="rsTable"><!--data--></table>
        </table>
</div>

As you can see it actually appends it to rsTable how can i maintain the original structure?

Thank You.

Upvotes: 1

Views: 154

Answers (2)

SimplGy
SimplGy

Reputation: 20437

In the tests I've run, doing a .emtpy() before a .prepend() was about 20% faster over 200 iterations than doing a .html(). Strange but true.

If your intent is to have both rsTable's in there, you should add a counter to the id or use a class, since ids must be unique.

It looks like you want to do this though:

$('#rsContainer').empty();
$('#rsContainer').prepend($('#rsTable'));

Upvotes: 1

Shishant
Shishant

Reputation: 9294

$('#rsContainer').slideUp('1000').load('index.php #rsTable', function() {
    $(this).slideDown('1000');
});

change the slideUp id to parent id.

Upvotes: 0

Related Questions