Форум

Alexprom · #1 (**permalink**) 23.09.2021, 13:05

Здравствуйте! Поделитесь пожалуйста примером сортировки таблицы по классу в TR
Никак не могу найти чтобы все tr с классом поднимались в вверх...
Может есть у когото пример?

Вот моя таблица

<table class="table table-bordered" id="myTable">
<?php
foreach($pages as $item){
    ?>
	<tr<?php if(empty($item['description'])){?> class="alert-danger"<?php }?>>
	<td><?=$item['title']?></td>
	<td><?php if($item['language_id']==1){echo "RU";}else{echo "UK";}?></td>
	<td><?php if(!empty($item['description'])){echo "Текст додано";}else{echo "Текст відсутній";}?></td>
	</tr><?php
}
?>
</table>

voraa · #2 (**permalink**) 23.09.2021, 13:28

Где и когда они должны подниматься?
При генерации таблицы на сервере?
В браузере при загрузке страницы?
По команде пользователя во время просмотра страницы?

Alexprom · #3 (**permalink**) 23.09.2021, 13:39

Сообщение от voraa

Где и когда они должны подниматься?
При генерации таблицы на сервере?
В браузере при загрузке страницы?
По команде пользователя во время просмотра страницы?

При загрузке страницы. Некоторые TR имею класс, остальные не имеют. хочется чтобы те которые имеют, выводились в самый верх

voraa · #4 (**permalink**) 23.09.2021, 13:54

<body>
<table id=myTable>
<tr class=alert-danger><td>1</td><td>Class</td><tr>
<tr><td>2</td><td>No class</td><tr>
<tr><td>3</td><td>No class</td><tr>
<tr class=alert-danger><td>4</td><td>Class</td><tr>
<tr><td>5</td><td>No class</td><tr>
<tr class=alert-danger><td>6</td><td>Class</td><tr>
</table>
<script>
function dangerUp () {
  const tab = document.getElementById('myTable');
  const trnocl = tab.querySelector('tr:not(.alert-danger)'); // первая строка без класса
  if (!trnocl) return;
  const trscl = tab.querySelectorAll('tr.alert-danger'); // все строки с классом
  trnocl.before(...trscl);
}
dangerUp();
</script>
</body>

Alexprom · #5 (**permalink**) 23.09.2021, 14:01

Сообщение от voraa

<body>
<table id=myTable>
<tr class=alert-danger><td>1</td><td>Class</td><tr>
<tr><td>2</td><td>No class</td><tr>
<tr><td>3</td><td>No class</td><tr>
<tr class=alert-danger><td>4</td><td>Class</td><tr>
<tr><td>5</td><td>No class</td><tr>
<tr class=alert-danger><td>6</td><td>Class</td><tr>
</table>
<script>
function dangerUp () {
  const tab = document.getElementById('myTable');
  const trnocl = tab.querySelector('tr:not(.alert-danger)'); // первая строка без класса
  if (!trnocl) return;
  const trscl = tab.querySelectorAll('tr.alert-danger'); // все строки с классом
  trnocl.before(...trscl);
}
dangerUp();
</script>
</body>

Вау, то что нужно)))) БОльшое вам спасибо)))

Жаль еще раз на рейтинг нажать не могу(

Форум

Справочник

Discord чат

Курсы javascript