Как создать функцию сортировки на таблице?Javascript

Форум по Javascript
Ответить
Anonymous
 Как создать функцию сортировки на таблице?

Сообщение Anonymous »

Страница здесь для справки: https://songscape-helgasonpete.replit.a ... mlобразной Но я хочу иметь возможность сортировать информацию в этих двух таблицах. Поэтому под кнопкой «Песни как писателя» - я хочу иметь возможность сортировать информацию в под руководством «Песня» «Писатель», изначально «Заголовки», а также информация под заголовком «Оригинальный релиз». заголовок «StreamCount». Таблица будет активирована кнопкой. Вот код для справки: < /p>




Clarence Williams






th {
color: white;
}





Clarence Williams
Изображение

Born: October 8, 1898

Died: November 6, 1965

Rankings:

1st most streamed writer

2nd most streamed performer

Songs As Writer
Songs As Performer



Song
Writer
Originally By
Original Release



Gulf Coast Blues
Clarence Williams
Bessie Smith - Clarence Williams at the Piano
May 1923



Baby, Won't You Please Come Home
Charles Warfield Clarence Williams
Bessie Smith - Clarence Williams at the Piano
June 1923






Title
Performer
Release Date
Stream Count



Down Hearted Blues
Bessie Smith - Clarence Williams at the Piano
May 1923
1294462



Gulf Coast Blues
Bessie Smith - Clarence Williams at the Piano
May 1923
89052



Baby Won't You Please Come Home Blues
Bessie Smith - Clarence Williams at the Piano
June 1923
1832242



Oh Daddy Blues
Bessie Smith - Clarence Williams at the Piano
June 1923
37590






// Create a function to update your display area
function updateDisplay(tableId) {

// The function receives the id of the table to show (give each table a unique id, but the same class)

// Set the display value of all tables with the target class to none
document.querySelectorAll(".specialTable").forEach(el => {
el.style.display = "none";
});

// Set the display value of the table with the target id to block
document.getElementById(tableId).style.display = "block";

$('#songCol').on('click', async function () {
let newSortOrder;
sortKey = "Song";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#writerCol').on('click', async function () {
let newSortOrder;
sortKey = "Writer";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#originalperformerCol').on('click', async function () {
let newSortOrder;
sortKey = "Originally By";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#releaseCol').on('click', async function () {
let newSortOrder;
sortKey = "Original Release";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#titleCol').on('click', async function () {
let newSortOrder;
sortKey = "Title";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#performerCol').on('click', async function () {
let newSortOrder;
sortKey = "Performer";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#releasetwoCol').on('click', async function () {
let newSortOrder;
sortKey = "Release Date";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});

$('#streamCol').on('click', async function () {
let newSortOrder;
sortKey = "Stream Count";
if (lastSortOrder != "asc") {
newSortOrder = "asc";
} else {
newSortOrder = "desc";
}

myArray = await performSort(myArray, sortKey, newSortOrder);
buildtable(myArray);
});
}








Подробнее здесь: https://stackoverflow.com/questions/797 ... on-a-table
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»