Как сгруппировать список по первой букве?

Question

У меня есть список, и мне нужно сделать что-то вроде этого:

A.

Andrei


Andreea

B.

Bogdan

Borris

и т. Д.

Итак, теперь у меня есть JavaScript, который упорядочивает мой список в алфавитном порядке, но я не знаю, как вставить эту функцию с первой буквы. Можете ли вы помочь мне счто пожалуйста?

Вот мой код:

     <ul style="list-style: none;right: 40px; position: relative" id="destPopuler">
           @foreach($users->contact as $user)

                     @if( $user->role[0]->pivot->role_id == 1 )
           <li class="country"><input class="my_div" id="{{$user->username}}" name="target_id[]" type="checkbox" value="{{ $user->id }}" <?php if(isset($replyMessage)){ if($replyMessage == $user->id) { echo "checked"; } } ?>><span style="padding: 5px" class="name">{{ $user->username }}</span></li>
                     @endif

                 @endforeach
</ul>

function sortList(ul) {
  var ul = document.getElementById(ul);

  Array.from(ul.getElementsByTagName("LI"))
    .sort((a, b) => a.textContent.localeCompare(b.textContent))
    .forEach(li => ul.appendChild(li));
}

sortList("destPopuler");

Вот что-то вроде того, что я хочу: jQuery Группировка по первой букве , но я не знаю, как именночтобы вставить его на основе моего кода.

Answer 1

Вы можете предоставить это на стороне Laravel -

 ... public function users() 
     {
         $users = Users::all();

         $groupedUsers = $users->groupBy(function($item,$key) {
             return $item->username[0]; 
         })->sortBy(function($item,$key){      
             return $key;
         });

         return view('users', ['users' => $groupedUsers]);
     }

Или, если вы хотите использовать свою функцию, вы можете поместить свой js-код в раздел для javascript:

В вашем макете выдолжен включать -

      @yield('js')

А на ваш взгляд -

      @section('js')
         // your js function
      @endsection