Cliquer sur les en-tĂȘte de colonne
par Famille total ratio ratio_pro prix_moyen
TOUTES CATEGORIES26811015100.008.325350
LOISIRS726947527.110.39263
MODE679474525.340.02172
MAISON578362221.571.17176
VEHICULES298463011.1322.566579
MULTIMEDIA13989875.220.48136
IMMOBILIER13809425.1576.57120367
MATERIEL PROFESSIONNEL5019081.8711.784142
SERVICES4101891.5367.5024
VACANCES1450110.543.4052
Autres869460.320.00315
EMPLOI545600.20100.006278

<table id="a">
 <tr>
 <td onclick="sortTable('a',0,'asc','char')"><b>par Famille</b></a></td>
 <td onclick="sortTable('a',1,'asc','num')">total</a></td>
 <td onclick="sortTable('a',2,'asc','num')">ratio</a></td>
 <td onclick="sortTable('a',3,'desc','num')">ratio_pro</a></td>
 <td onclick="sortTable('a',4,'desc','num')">prix_moyen</a></td>
 </tr>
 <tr><td>TOUTES CATEGORIES</td><td>26811015</td><td>100.00</td><td>8.32</td><td>5350</td></tr>
 <tr><td>LOISIRS</td><td>7269475</td><td>27.11</td><td>0.39</td><td>263</td></tr>
 <tr><td>MODE</td><td>6794745</td><td>25.34</td><td>0.02</td><td>172</td></tr>
 <tr><td>MAISON</td><td>5783622</td><td>21.57</td><td>1.17</td><td>176</td></tr>
 <tr><td>VEHICULES</td><td>2984630</td><td>11.13</td><td>22.56</td><td>6579</td></tr>
 <tr><td>MULTIMEDIA</td><td>1398987</td><td>5.22</td><td>0.48</td><td>136</td></tr>
 <tr><td>IMMOBILIER</td><td>1380942</td><td>5.15</td><td>76.57</td><td>120367</td></tr>
 <tr><td>MATERIEL PROFESSIONNEL</td><td>501908</td><td>1.87</td><td>11.78</td><td>4142</td></tr>
 <tr><td>SERVICES</td><td>410189</td><td>1.53</td><td>67.50</td><td>24</td></tr>
 <tr><td>VACANCES</td><td>145011</td><td>0.54</td><td>3.40</td><td>52</td></tr>
 <tr><td>Autres</td><td>86946</td><td>0.32</td><td>0.00</td><td>315</td></tr>
 <tr><td>EMPLOI</td><td>54560</td><td>0.20</td><td>100.00</td><td>6278</td></tr>
</table>

<script>
function sortTable(tableid, n, dir, isnum){
  var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
  table = document.getElementById(tableid);
  switching = true;

  /* Make a loop that will continue until no switching has been done: */
  while (switching){
    // Start by saying: no switching is done:
    switching = false;
    rows = table.rows;
  
    /* Loop through all table rows (except the first, which contains table headers): */
    for (i = 1; i  (rows.length - 1); i++){
      // Start by saying there should be no switching:
      shouldSwitch = false;
   
      /* Get the two elements you want to compare,
      one from current row and one from the next: */
      x = rows[i].getElementsByTagName("TD")[n];
      y = rows[i + 1].getElementsByTagName("TD")[n];
  
      /* Check if the two rows should switch place,
      based on the direction, asc or desc: */
      if (dir == "asc") {
        if(isnum=='num'){
            if (Number(x.innerHTML) > Number(y.innerHTML)) {
                shouldSwitch = true;
                break;
            }
        }
        else{
            if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
                shouldSwitch = true;
                break;
            }
        }
      }
      else if (dir == "desc"){
        if(isnum=='num')
                   if (Number(x.innerHTML)  Number(y.innerHTML)) {
                shouldSwitch = true;
                break;
            }
        }
        else{
            if (x.innerHTML.toLowerCase()  y.innerHTML.toLowerCase()) {
                shouldSwitch = true;
                break;
            }
        }
      }
    }
  
    if (shouldSwitch) {
      /* If a switch has been marked, make the switch and mark that a switch has been done: */
      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
      switching = true;
      // Each time a switch is done, increase this count by 1:
      switchcount ++; 
    } else {
      /* If no switching has been done AND the direction is "asc",
      set the direction to "desc" and run the while loop again. */
      if (switchcount == 0 && dir == "asc") {
        dir = "desc";
        switching = true;
      }
    }
  }
}
</script>