How to sort a tree table by rows (header on the left) with no <thead>

Question

I want to sort a tree table not by columns but rows, its header is on the left in the tree part. My tree table looks like this the tree table plugin I used.

And the code is something like this

  <table>
      <tr data-node-id="index">
        <th>Index</th>
        <td>...</td>
        <td>...</td>
      </tr>
      <tr data-node-id="patient">
        <th>Patient Characteristics</th>
      </tr>
      <tr data-node-id="name" data-node-pid="patient">
        <th>Name</th>
        <td>...</td>
        <td>...</td>
      </tr> 
      <tr data-node-id="DOB" data-node-pid="patient">
        <th>DOB</th>
        <td>...</td>
        <td>...</td>
      </tr> 
      <tr data-node-id="age" data-node-pid="patient">
      ...

There is no <thead> part, so many sorting methods not work well on this table. I'm new to javascript sort of things, and have no idea if this is easy to do. But I did not find methods for this situation online, so I try to ask for help.

Answer 1

First, access the table element:

var table = document.getElementById("table").children[0]; // You can just add an id to the table

Here is a function for sorting by row:

function sortRow(rowNum) { // rowNum is index of row: for example, name is 2
var answerArray = [];
for (i = 1; i < table.children[rowNum].children.length; i++) {
    answerArray.push(table.children[rowNum].children[i].innerHTML);
}
return answerArray;

This function takes in the row number, and returns an array of all values in the row.