Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

yeon-develope's avatar

Alpine's JS x-sort with the database item position instead of the relative default Alpine's JS $position

Is there a way to handle the position of the actual element, not the relative one that the x-sort plugin gave us. What I mean is something like this (a laravel's livewire usage), where each item has it's own default position from the backend (already defined in the database)

<ul x-sort="console.log($item, $position)">
  @foreach($items->sortBy('position') as $item)
    <li x-sort:item="'{{$item->id}}'" x-sort:position="{{$item->position}}">
       {{-- ... --}}
    </li>
  @endforeach
</ul>

The issue comes because let's say we return two elements in the foreach and the first element has a default backend position of 2 and the second one has a position of 4. So by using the x-sort relative positon each elements is sorted by its default positions of 0 and 1

Here's some example: https://github.com/user-attachments/assets/a2f28653-b70f-4946-bd82-3a11bb9371d5

0 likes
0 replies

Please or to participate in this conversation.