Как отсортировать несколько таблиц с одной и той же функцией по "TableId"? - PullRequest
Новая
       18

Как отсортировать несколько таблиц с одной и той же функцией по "TableId"?

0 голосов
/ 19 мая 2019

Я пытаюсь из https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sort_table_desc, но это не работает для нескольких таблиц. 

    <table id="tableData1">
        <tr>
            <th onclick="sortTable(0)">Input Date</th>
            <th onclick="sortTable(1)">Periode</th>
            <th onclick="sortTable(2)">Account</th>
        </tr>
        <tr>
            <td>2019-05-13</td>
            <td>2019-05</td>
            <td>Name A</td>
        </tr>
        <tr>
            <td>2019-04-02</td>
            <td>2019-04</td>
            <td>Name A</td>
        </tr>
        <tr>
            <td>2019-03-02</td>
            <td>2019-03</td>
            <td>Name A</td>
        </tr>
    </table>
    <table id="tableData2">
        <tr>
            <th onclick="sortTable(0)">Input Date</th>
            <th onclick="sortTable(1)">Periode</th>
            <th onclick="sortTable(2)">Account</th>
        </tr>
        <tr>
            <td>2019-05-10</td>
            <td>2019-05</td>
            <td>Name B</td>
        </tr>
        <tr>
            <td>2019-04-01</td>
            <td>2019-04</td>
            <td>Name B</td>
        </tr>
        <tr>
            <td>2019-03-05</td>
            <td>2019-03</td>
            <td>Name B</td>
        </tr>
    </table>

И это код Javascript: 

var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;

table = document.getElementsById("tableData");
switching = true;
dir = "asc"; 
while (switching) {
    switching = false;
    rows = table.getElementsByTagName("TR");
    for (i = 1; i < (rows.length - 1); i++) {
        shouldSwitch = false;
        x = rows[i].getElementsByTagName("TD")[n];
        y = rows[i + 1].getElementsByTagName("TD")[n];
        if (dir == "asc") {
            if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
            shouldSwitch= true;
            break;
            }
        } else if (dir == "desc") {
            if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
                shouldSwitch= true;
                break;
            }
        }
    }
    if (shouldSwitch) {
        rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
        switching = true;
        switchcount ++;      
    } else {
        if (switchcount == 0 && dir == "asc") {
        dir = "desc";
        switching = true;
        }
    }
}
}

Я знаюпочему скрипт не работает, этот скрипт только для одной таблицы, а не для нескольких, но могу ли я использовать этот скрипт для нескольких таблиц на одной странице?

Спасибо.

1 Ответ

0 голосов
/ 19 мая 2019

Ваш код завершается с ошибкой на table = document.getElementsById("tableData");, потому что этот элемент не существует, и это getElementById (один элемент).Вы можете изменить свой код на <th onclick="sortTable('dataTab1e1', 0)">Input Date</th>, а затем изменить свою функцию на: 

function sortTable(divName, item ) {
   var table = document.getElementById( divName );
....
}
...