Сортировка Laravel Blade

Laravel Blade Sortable предоставляет настраиваемые компоненты Blade для добавления сортируемых HTML-элементов с возможностью перетаскивания в приложения Laravel.

Just released "laravel-blade-sortable" 🎉

Add HTML element sorting to your @laravelphp #Blade views powered by @Alpine_JS and #SortableJs 👌

Use the sort order in form submissions or inside @LaravelLivewire components 🔥https://t.co/7NWXpFJp5P

Enjoy! 👍 Feedback welcomed! 🤗 pic.twitter.com/5w2fpQjZII

— Andrés Santibáñez (@asantibanez) February 5, 2021

Этот пакет использует SortableJS и AlpineJS для сортировки и предоставляет два настраиваемых блейд-компонента для сортировки элементов DOM:

<x-laravel-blade-sortable::sortable as="ul">
    <x-laravel-blade-sortable::sortable-item sort-key="jason">
        Jason
    </x-laravel-blade-sortable::sortable-item>
    <x-laravel-blade-sortable::sortable-item sort-key="andres">
        Andres
    </x-laravel-blade-sortable::sortable-item>
    <x-laravel-blade-sortable::sortable-item sort-key="matt">
        Matt
    </x-laravel-blade-sortable::sortable-item>
    <x-laravel-blade-sortable::sortable-item sort-key="james">
        James
    </x-laravel-blade-sortable::sortable-item>
</x-laravel-blade-sortable::sortable>

Без написания какого-либо пользовательского кода JavaScript вы можете добиться примерно следующего:

Этот пакет также поддерживает Laravel Livewire и другие дополнительные параметры настройки. Ознакомьтесь с readme, в котором подробно описаны параметры компонентов, а также доступные дополнительные функции.