minor fixes
This commit is contained in:
parent
b015213b7b
commit
50395ec56e
2 changed files with 2 additions and 14 deletions
|
@ -2,12 +2,7 @@ The solution is short, yet may look a bit tricky, so here I provide it with exte
|
||||||
|
|
||||||
```js
|
```js
|
||||||
let sortedRows = Array.from(table.tBodies[0].rows) // 1
|
let sortedRows = Array.from(table.tBodies[0].rows) // 1
|
||||||
.sort((rowA, rowB) => { // 2
|
.sort((rowA, rowB) => rowA.cells[0].innerHTML.localeCompare(rowB.cells[0].innerHTML));
|
||||||
let valueA = rowA.cells[0].innerHTML;
|
|
||||||
let valueB = rowB.cells[0].innerHTML;
|
|
||||||
return valueA > valueB ? 1 :
|
|
||||||
valueA == valueB ? 0 : -1;
|
|
||||||
});
|
|
||||||
|
|
||||||
table.tBodies[0].append(...sortedRows); // (3)
|
table.tBodies[0].append(...sortedRows); // (3)
|
||||||
```
|
```
|
||||||
|
@ -20,6 +15,4 @@ The step-by-step algorthm:
|
||||||
|
|
||||||
We don't have to remove row elements, just "re-insert", they leave the old place automatically.
|
We don't have to remove row elements, just "re-insert", they leave the old place automatically.
|
||||||
|
|
||||||
Please note: our comparison function `(2)` returns `0` for equal table rows. That's handy for cases when we accidentally re-sort the table. E.g. if our users triggers such re-sorting. Returning `0` makes sure that same-named users won't get re-ordered, as opposed to a more simpler solution `valueA > valueB ? 1 : -1`.
|
|
||||||
|
|
||||||
P.S. In our case, there's an explicit `<tbody>` in the table, but even if HTML table doesn't have `<tbody>`, the DOM structure always has it.
|
P.S. In our case, there's an explicit `<tbody>` in the table, but even if HTML table doesn't have `<tbody>`, the DOM structure always has it.
|
||||||
|
|
|
@ -24,12 +24,7 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
let sortedRows = Array.from(table.tBodies[0].rows)
|
let sortedRows = Array.from(table.tBodies[0].rows)
|
||||||
.sort((rowA, rowB) => {
|
.sort((rowA, rowB) => rowA.cells[0].innerHTML.localeCompare(rowB.cells[0].innerHTML));
|
||||||
let valueA = rowA.cells[0].innerHTML;
|
|
||||||
let valueB = rowB.cells[0].innerHTML;
|
|
||||||
return valueA > valueB ? 1 :
|
|
||||||
valueA == valueB ? 0 : -1;
|
|
||||||
});
|
|
||||||
|
|
||||||
table.tBodies[0].append(...sortedRows);
|
table.tBodies[0].append(...sortedRows);
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue