tags:

views:

40

answers:

2

I have the following markup on the page. I want to append two more table rows right after this one.

<tr><td width="48%" align="right" nowrap=""><b>Type it again:</b></td><td width="52%"> <input type="password" autocomplete="off" maxlength="20" size="20" name="passwordagain"><!-- value="" --></td></tr>

Here are the two I want to append to the first one above

<tr><td width="48%" align="right" nowrap="nowrap"><b>First Name:</b></td><td width="52%"> <input maxlength="35" value="" size="30" name="BillingFirstName"></td></tr>
<tr><td width="48%" align="right" nowrap="nowrap"><b>Last Name:</b></td><td width="52%"> <input name="BillingLastName" size="30" value="" maxlength="35"></td></tr>
A: 

this should work:

$('table').append('<tr>row 1</tr><tr>row 2</tr>');

where table is the parent table. You may have to use tbody if you have that in your table instead.

Mitch R.
+1  A: 

Assuming you know exactly what the two new rows should be, here's a quick and dirty way:

$('tr:has(:input[name=passwordagain])') // row in question: no ID to use?
  .after('<tr><td>...First Name...</td></tr>') // to add
  .next()                                      // don't reverse order
  .after('<tr><td>...Last Name...</td></tr>'); // next to add

You could omit the next() and simply put the .after()s in reverse order, or stick them in the same string, or any number of other variations.

Based on your comment, here's a Fiddle that should clarify what's going on.

Ken Redler
I do not understand the ...first name...
That's meant to be shorthand -- meaning, "all that other stuff in the 'First Name' row goes here". The entirety of the `<tr>` you want to insert goes inside the `.after()` call, and will be inserted by jQuery immediately after the row with "passwordagain". I did show "first name" twice; the second one was meant to be "last name". Fixed that.
Ken Redler
@user, check out the jsFiddle referenced above in my answer. It shows a working solution.
Ken Redler
Thanks for all the trouble, worked!!