diff --git a/2-ui/1-document/07-modifying-document/12-sort-table/solution.md b/2-ui/1-document/07-modifying-document/12-sort-table/solution.md
index f40a331d..595f068c 100644
--- a/2-ui/1-document/07-modifying-document/12-sort-table/solution.md
+++ b/2-ui/1-document/07-modifying-document/12-sort-table/solution.md
@@ -1,9 +1,13 @@
The solution is short, yet may look a bit tricky, so here I provide it with extensive comments:
-
```js
-let sortedRows = Array.from(table.tBodies[0].rows) // (1)
- .sort((rowA, rowB) => rowA.cells[0].innerHTML > rowB.cells[0].innerHTML ? 1 : -1); // (2)
+let sortedRows = Array.from(table.tBodies[0].rows) // 1
+ .sort((rowA, rowB) => { // 2
+ 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)
```
@@ -14,6 +18,8 @@ The step-by-step algorthm:
2. Then sort them comparing by the content of the first `| ` (the name field).
3. Now insert nodes in the right order by `.append(...sortedRows)`.
-Please note: 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.
-Also note: even if the table HTML doesn't have ` | `, the DOM structure always has it. So we must insert elements as `table.tBodes[0].append(...)`: a simple `table.append(...)` would fail.
+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 `` in the table, but even if HTML table doesn't have ``, the DOM structure always has it.
diff --git a/2-ui/1-document/07-modifying-document/12-sort-table/solution.view/index.html b/2-ui/1-document/07-modifying-document/12-sort-table/solution.view/index.html
index 81e98574..7858ee23 100644
--- a/2-ui/1-document/07-modifying-document/12-sort-table/solution.view/index.html
+++ b/2-ui/1-document/07-modifying-document/12-sort-table/solution.view/index.html
@@ -1,37 +1,35 @@
-
-
-
-
- | Name |
- Surname |
- Age |
-
-
- | John |
- Smith |
- 10 |
-
-
- | Pete |
- Brown |
- 15 |
-
-
- | Ann |
- Lee |
- 5 |
-
-
+
+
+
+ | Name | Surname | Age |
+
+
+
+
+ | John | Smith | 10 |
+
+
+ | Pete | Brown | 15 |
+
+
+ | Ann | Lee | 5 |
+
+
+ | ... | ... | ... |
+
+
+
-
-
-
-
+ table.tBodies[0].append(...sortedRows);
+
diff --git a/2-ui/1-document/07-modifying-document/12-sort-table/source.view/index.html b/2-ui/1-document/07-modifying-document/12-sort-table/source.view/index.html
index e41eb229..9071c88e 100644
--- a/2-ui/1-document/07-modifying-document/12-sort-table/source.view/index.html
+++ b/2-ui/1-document/07-modifying-document/12-sort-table/source.view/index.html
@@ -1,33 +1,27 @@
-
-
-
-
- | Name |
- Surname |
- Age |
-
-
- | John |
- Smith |
- 10 |
-
-
- | Pete |
- Brown |
- 15 |
-
-
- | Ann |
- Lee |
- 5 |
-
-
+
+
+
+ | Name | Surname | Age |
+
+
+
+
+ | John | Smith | 10 |
+
+
+ | Pete | Brown | 15 |
+
+
+ | Ann | Lee | 5 |
+
+
+ | ... | ... | ... |
+
+
+
-
-
-
-
+
diff --git a/2-ui/1-document/07-modifying-document/12-sort-table/task.md b/2-ui/1-document/07-modifying-document/12-sort-table/task.md
index 41d6fca2..7cdba35b 100644
--- a/2-ui/1-document/07-modifying-document/12-sort-table/task.md
+++ b/2-ui/1-document/07-modifying-document/12-sort-table/task.md
@@ -6,33 +6,29 @@ importance: 5
There's a table:
+```html run
-
- | Name |
- Surname |
- Age |
-
-
- | John |
- Smith |
- 10 |
-
-
- | Pete |
- Brown |
- 15 |
-
-
- | Ann |
- Lee |
- 5 |
-
-
- | ... |
- ... |
- ... |
-
+
+
+ | Name | Surname | Age |
+
+
+
+
+ | John | Smith | 10 |
+
+
+ | Pete | Brown | 15 |
+
+
+ | Ann | Lee | 5 |
+
+
+ | ... | ... | ... |
+
+
+```
There may be more rows in it.