Упорядочить данные json с заголовком и соответствующими значениями заголовка

#javascript #jquery

Вопрос:

У меня есть этот массив данных, который я сортирую по фамилии

 JSON.parse(data).sort(function (a, b) {  return a.user_last.localeCompare(b.user_last); });

Вот образец, который я получаю после сортировки:

 {"title": "Dr.","first_name": "Pennie","last_name": "Abramson"}, {"title": "Prof.","first_name": "David","last_name": "Amob"}, {"title": "Prof.","first_name": "Dash","last_name": "Arnon"}, {"title": "Prof.","first_name": "Haim","last_name": "Bling"}, {"title": "Prof.","first_name": "Wow","last_name": "Bold"}, {"title": "Dr.","first_name": "Ron","last_name": "bondel"}, {"title": "Dr.","first_name": "katty","last_name": "Contor"}, {"title": "Prof.","first_name": "Ranny","last_name": "Cometon"}, {"title": "Dr.","first_name": "Roven","last_name": "Co"}

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

Название — все имена фамилий по значению last_name, которое начинается с

Title — B все имена фамилий по значению last_name, которое начинается с B

Название — C все имена фамилий по значению фамилия, которое начинается с C

и так далее…

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

 $.each(JSON.parse(data), function (i, item) {  var letter = JSON.parse(data);  console.log(JSON.parse(data));  if(item.socket_id !== '0' amp;amp; item.user_last.charAt(0) == item.user_last[0].charAt(0) ){  $("#watching-window").append('lt;div class="letter"gt;' item.user_last[0].charAt(0) 'lt;/divgt;lt;ulgt;lt;ligt;' item.user_title ' ' item.user_first ' ' item.user_last 'lt;ligt;lt;/ulgt;').fadeIn(400)  }   });

как я могу правильно его заказать

Пример вывода

 lt;div class="watching-window" id="watching-window"gt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Mrs. Pennie Abramsonlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Mr. Gary M. Abramsonlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Mr. Alfredo Acharlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Dr. Carole Ackermannlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Mrs. Karen Aiachlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Dr. Mark Alexanderlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Lord David Alliancelt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Alt;/divgt;lt;ulgt;lt;ligt;Mr. Ilan Artzilt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Blt;/divgt;lt;ulgt;lt;ligt;Prof. Paolo Barbantilt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Blt;/divgt;lt;ulgt;lt;ligt;Mr. Stephen Barclaylt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Blt;/divgt;lt;ulgt;lt;ligt;Prof. Allen J. Bardlt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Blt;/divgt;lt;ulgt;lt;ligt;Prof. Istvan Barnalt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Blt;/divgt;lt;ulgt;lt;ligt;Dr. Carolyn Barshalllt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;slt;/divgt;lt;ulgt;lt;ligt;sdfg 345 sdfglt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;div class="letter"gt;Dlt;/divgt;lt;ulgt;lt;ligt;Mr Demo Demolt;/ligt;lt;ligt;lt;/ligt;lt;/ulgt;lt;/divgt;

Ответ №1:

Вы можете сохранить букву, и если значение ltter меняется, добавьте новую строку письма.

 const  data = [{ title: "Dr.", first_name: "Pennie", last_name: "Abramson" }, { title: "Prof.", first_name: "David", last_name: "Amob" }, { title: "Prof.", first_name: "Dash", last_name: "Arnon" }, { title: "Prof.", first_name: "Haim", last_name: "Bling" }, { title: "Prof.", first_name: "Wow", last_name: "Bold" }, { title: "Dr.", first_name: "Ron", last_name: "bondel" }, { title: "Dr.", first_name: "katty", last_name: "Contor" }, { title: "Prof.", first_name: "Ranny", last_name: "Cometon" }, { title: "Dr.", first_name: "Roven", last_name: "Co" }];  data.forEach(((letter, ul) =gt; o =gt; {  if (letter !== o.last_name[0].toUpperCase()) {  letter = o.last_name[0].toUpperCase();  ul = document.createElement('ul');  document.body.appendChild(document.createTextNode('Letter '   letter));  document.body.appendChild(ul);  }  const li = document.createElement('li');  li.innerHTML = o.last_name;  ul.appendChild(li); })());

 .as-console-wrapper { max-height: 100% !important; top: 0; }