1

My question is very similar to this topic. I'm trying to use jquery, so that when you click on a table row, it loads certain information from another page and insert as a new row below the one clicked on.

If I didn't have to load the data from another page, I could just use something like:

clicked.after('<tr><td>Something</td><td>Something</td></tr>');

If I wanted to load and insert into something other than a table, I could use something like:

clicked.after($('<div>').load("Page2.aspx"));

So how do I go about combining these two together? If I have on the first page:

clicked.after($('<div>').load("Page2.aspx"));

And have Page2.aspx returning:

<tr><td>Something</td><td>Something</td></tr>

I would get this:

<tr><td>...</td><td>...</td></tr><div><tr><td>Something</td><td>Something</td></tr></div>

Which is not valid HTML.

Any suggestions?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Pupper
  • 2,315
  • 2
  • 22
  • 29

1 Answers1

1

Use after in the callback of a get rather than load.

$('.clicked').click( function() {
    var $clicked = $(this);
    $.get('Page2.aspx', function(html) {
        $clicked.after(html);
    });
});
tvanfosson
  • 524,688
  • 99
  • 697
  • 795
  • You can accept this answer as the solution to your question using the check mark next to the up/down voting answers. – tvanfosson Nov 21 '11 at 00:19