Roger Farley
Roger Farley

Reputation: 15

How can I break a table row into two table rows using jQuery

I have a wide table that I would like to split each row into two rows, after each cell with the class "column-6".

$( ".column-6" ).after( "</tr><tr class='secondary'>" );

For some reason it is included as:

<tr class="secondary"></tr>

JS Fiddle example: http://jsfiddle.net/xa9nk/1/

Upvotes: 0

Views: 162

Answers (1)

King King
King King

Reputation: 63387

I think you should change the html of the table. First you have to insert the token at the positions you want, then perform the replacement of the token with the string you want (which is </tr><tr class='secondary'>):

var yourOtherFace = jQuery.noConflict();
var token = "sdfdskjflsfj34234ksldjfskdl";

yourOtherFace( ".column-6" ).after(token)
 .closest('table').html(function(i,oldHtml){
     return oldHtml.replace(new RegExp(token,"g"), "</tr><tr class='secondary'>");     
 });

yourOtherFace('.column-1').attr('rowspan', '2');

Demo.

Here's another solution using pure Regex without inserting some token first, it may be shorter but I've made a test case and looks like it's about 40% slower than the first solution (using token).

Demo 2

Here is the performance test.

Upvotes: 1

Related Questions