Sort HTML tables

Asked

Viewed 3,648 times

1

I have 2 tables that were initialized in HTML but that join rows and columns through 2 Javascript functions.

HTML Table 1:

<table id="myTable" >
  <thead>
      <tr>
    <th>Disciplina</th>
    <th>Prioridade</th>
      </tr>
  </thead>
    <tbody>
        <tr>
        </tr>
    </tbody>
</table>

HTML Table 2:

<table id="myTable2">
  <thead>
      <tr>
    <th>Disciplina</th>
    <th>Método de avaliação</th>
    <th>Data da avaliação</th>
    <th>Antecedência</th>
    <th>Duração por dia</th>
      </tr>
  </thead>
    <tbody>
    </tbody>
</table>

Javascript:

     //Tabela 1 
    ...
    var array = localStorage.getItem("ListaDisciplinas").split(','); // lista de disciplinas
    for(i=0;i<array.length;i++){
        var a = document.getElementById( "mySelect" + i);
        var valor1 = a.options[a.selectedIndex].text;
        localStorage.setItem("Prioridade" + array[i],valor1);
        localStorage.setItem("Disciplinas" + i,array[i]);
        var table = document.getElementById("myTable");
        var row = table.insertRow(1);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        cell1.innerHTML = localStorage.getItem("Disciplinas" + i);
        cell2.innerHTML = localStorage.getItem("Prioridade" + array [i]);
}
    ...


        // tabela 2
      ...
        var table = document.getElementById("myTable2");
                var row = table.insertRow(1);
                var cell1 = row.insertCell(0);
                var cell2 = row.insertCell(1);
                var cell3 = row.insertCell(2);
                var cell4 = row.insertCell(3);
                var cell5 = row.insertCell(4);
                cell1.innerHTML = localStorage.getItem("disciplinas");
                cell2.innerHTML = localStorage.getItem("metododeavaliaçao");
                cell3.innerHTML = localStorage.getItem("Data");
                cell4.innerHTML = localStorage.getItem("DiasAtecedencia");
                cell5.innerHTML = localStorage.getItem("duraçaopordia");
                  ...

What I intend is to sort ,with Javascript or Jquery , Table 1 alphabetically by the name of the disciplines , first column and sort Table 2 by date , third column

  • Do you query this information from any database? wouldn’t it be easier to sort on sql?

  • Tables are being used in an HTML page and to sort I can only use Javascript or Jquery

  • how is the variable defined i?

  • I’ve put the code all right

  • Was any of the answer helpful? Don’t forget to choose one and mark it so it can be used if someone has a similar question!

1 answer

1


You can use the method sort of array:

Sort:

The method sort() organizes the items of a array.

Sort by the name of the disciplines:

array.sort(function(a, b){
  if(a.disciplinas < b.disciplinas) {
    return -1;
  }

  if(a.disciplinas > b.disciplinas) {
    return 1;
  }

  return 0;
})

Sort by date of disciplines:

array.sort(function(a,b){
  return new Date(b.Data) - new Date(a.Data);
});
  • @Srack , good night, using . Sort it is possible to make a sorting algorithm with priority ?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.