CODEWITHSUNDEEP
html
Zoha Ali Khan
Zoha Ali Khan

Reputation: 1699

insertion of an html tag between rows of a table

Can I insert any html tag inbetween table rows such that the inserted tag serves as a parent node for the rows after that tag. Like

<table>
  <tr><td>group 1</td></tr>
  //insert tag here
     <tr><td>patent 1 in group 1</td></tr>
     <tr><td>patent 2 in group 1</td></tr>
  //end tag here
</table>

I want the inserted tag to be the parent node for the rest of rows. Or is it possible to make the 1st row as parent node for the rest of the rows

Edit: What I actually want to achieve

I want to create a table with multiple rows in which one row will be a group name and it will serve as parent row, this row will contain sub rows and I should be able to drag and drop rows from one group to another which I am currently able to do with TableDnd Plugin but I need the id of the parent row to which the sub row is draged.

If I do something like this

<table id="sort">
    <tbody id = 'group_1'>
    <tr id="1"><td>1</td><td>One</td><td><input type="text" name="one" value="one"/></td></tr>
    <tr id="2"><td>2</td><td>Two</td><td><input type="text" name="two" value="two"/></td></tr>
    <tr id="3"><td>3</td><td>Three</td><td><input type="text" name="three" value="three"/></td></tr>
    </tbody>
    <tbody id = 'group_2'>
    <tr id="4"><td>4</td><td>Four</td><td><input type="text" name="four" value="four"/></td></tr>
    <tr id="5"><td>5</td><td>Five</td><td><input type="text" name="five" value="five"/></td></tr>
    <tr id="6"><td>6</td><td>Six</td><td><input type="text" name="six" value="six"/></td></tr>
    </tbody>
</table>

I am able to drag rows with in one tbody but not from one tbody to another. How can I get that any other solution?

Upvotes: 2

Views: 1967

Answers (2)

davioooh
davioooh

Reputation: 24706

Use css classes to group your rows:

<table>
     <tr class="group-1"><td>patent 1 in group 1</td></tr>
     <tr class="group-1"><td>patent 2 in group 1</td></tr>
     <tr class="group-2"><td>patent 1 in group 2</td></tr>
     <tr class="group-2"><td>patent 2 in group 2</td></tr>
     <!-- etc -->
</table>

or multiple TBODY sections:

<table>
    <tbody class="group-1">
       <tr><td>patent 1 in group 1</td></tr>
       <tr><td>patent 2 in group 1</td></tr>
    </tbody>
    <tbody class="group-2">
       <tr><td>patent 1 in group 2</td></tr>
       <tr><td>patent 2 in group 2</td></tr>
    </tbody>
    <!-- etc -->
</table>

Upvotes: 1

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201758

The only valid ways to group table rows are thead, tbody, and tfoot elements. The normal way to group data rows is tbody.

Upvotes: 2

Related Questions