Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.07.2019, 07:30
Новичок на форуме
Отправить личное сообщение для Temofei Посмотреть профиль Найти все сообщения от Temofei
 
Регистрация: 29.07.2019
Сообщений: 5

Нужна помощь - сортировка фотографий с помощью JS
Добрый день!
Очень нужна помощь, есть шаблон вывода фотогалереи в одной очень экзотической CMS
{reduce:space}
{mask:main}
<div class="command-list"><div class="command-list_in">	
{mask:item}{if: {img}} 
<div class="command-one">
<div class="command-image"><a href="/images/0/{img}" class="fancybox" rel="gallery" title="{title}"><figure><img src="/images/1/{img}" alt=""/></figure></a></div>
<div class="foto-title">{title}</div>
</div>
{/}{/mask}	
</div></div>
<div class="back-link rightpos">
<a href="{backurl}"><span></span> К списку альбомов</a>
</div>
{/mask}



На просторах интернета нашел пример сортировки с помощью JS, но, чувствую, что-то не то делаю.. знания самые начальные.. нужна ваша помощь
<script>
var body = document.getElementById("command-image");
var listElms = body.getElementsByClassName("fancybox");
var sortedElms = Array.prototype.slice.call(listElms).sort(function(a, b) { 
return a.dataset.title > b.dataset.title
});

for (var i = 0; i < sortedElms.length; i++) {
body.appendChild(sortedElms[i]);
}
</script>


Сортировать хотел бы по названию - title (будет фамилия, в алфавитном порядке). Сортировать хотел бы налету при загрузке страницы.

Последний раз редактировалось Temofei, 29.07.2019 в 07:32. Причина: указал существенное требование
Ответить с цитированием
  #2 (permalink)  
Старый 29.07.2019, 07:42
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Temofei
Сортировать хотел бы налету при загрузке страницы
В этом случаен что мешает входные данные отсортировать сразу на сервере?
Ответить с цитированием
  #3 (permalink)  
Старый 29.07.2019, 13:59
Новичок на форуме
Отправить личное сообщение для Temofei Посмотреть профиль Найти все сообщения от Temofei
 
Регистрация: 29.07.2019
Сообщений: 5

Сообщение от laimas Посмотреть сообщение
В этом случаен что мешает входные данные отсортировать сразу на сервере?
Мешает говно CMS, задача есть, решить ее как-то надо, а времени колупаться с CMS нету. В ней даже есть какая-то сортировка, но она не работает.
Ответить с цитированием
  #4 (permalink)  
Старый 29.07.2019, 14:05
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Temofei
В ней даже есть какая-то сортировка, но она не работает.
Какая именно? Большая вероятность того, что данные отдаваемые в шаблонизатор, это результат запроса в базу, и если данные для title из нее же, то нудно указать сортировку выборки по этому полю. Чего копаться то, в запросе только указать нужное.

А на клиенте нужно сравнивать a.title и b.title.
Ответить с цитированием
  #5 (permalink)  
Старый 29.07.2019, 14:08
Новичок на форуме
Отправить личное сообщение для Temofei Посмотреть профиль Найти все сообщения от Temofei
 
Регистрация: 29.07.2019
Сообщений: 5

Сообщение от laimas Посмотреть сообщение
Какая именно? Большая вероятность того, что данные отдаваемые в шаблонизатор, это результат запроса в базу, и если данные для title из нее же, то нудно указать сортировку выборки по этому полю. Чего копаться то, в запросе только указать нужное.

А на клиенте нужно сравнивать a.title и b.title.
CMS Софтмажор
Ответить с цитированием
  #6 (permalink)  
Старый 30.07.2019, 02:21
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Temofei,
return a.title > b.title ? 1 : -1
Ответить с цитированием
  #7 (permalink)  
Старый 30.07.2019, 09:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

сортировка после загрузки
Temofei,
<script>
addEventListener("DOMContentLoaded", () => {
  const sliders = document.querySelectorAll(".command-list_in"),
        collator = new Intl.Collator(["en", "ru"], { numeric: true }),
        comparator = (a, b) => collator.compare(
        a.querySelector("[title]").title,
        b.querySelector("[title]").title);
       for(const slider of sliders) {
         slider.append(...[...slider.children].sort(comparator))
       }
})
  </script>

Последний раз редактировалось рони, 30.07.2019 в 09:35.
Ответить с цитированием
  #8 (permalink)  
Старый 30.07.2019, 21:34
Новичок на форуме
Отправить личное сообщение для Temofei Посмотреть профиль Найти все сообщения от Temofei
 
Регистрация: 29.07.2019
Сообщений: 5

Сообщение от рони Посмотреть сообщение
Temofei,
<script>
addEventListener("DOMContentLoaded", () => {
  const sliders = document.querySelectorAll(".command-list_in"),
        collator = new Intl.Collator(["en", "ru"], { numeric: true }),
        comparator = (a, b) => collator.compare(
        a.querySelector("[title]").title,
        b.querySelector("[title]").title);
       for(const slider of sliders) {
         slider.append(...[...slider.children].sort(comparator))
       }
})
  </script>
Спасибо! Все заработало! Аллилуйя!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Задания по JS. Нужна адекватная критика. lukas_aka_bo Общие вопросы Javascript 4 02.06.2018 10:39
Задать высоту div с помощью JS от ширины div`a aarka Элементы интерфейса 3 21.12.2017 13:15
Нужна помощь по Модальному окне js 1Feniks1 Общие вопросы Javascript 5 29.05.2015 09:52
нужна помощь по JS и JQuery cema93 Работа 1 16.12.2014 19:41
нужна помощь с js okapo AJAX и COMET 3 31.01.2012 04:32