Download the PHP package aldamr01/laravel-blade-sortable without Composer

On this page you can find all versions of the php package aldamr01/laravel-blade-sortable. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.

FAQ

After the download, you have to make one include require_once('vendor/autoload.php');. After that you have to import the classes with use statements.

Example:
If you use only one package a project is not needed. But if you use more then one package, without a project it is not possible to import the classes with use statements.

In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
Some PHP packages are not free to download and because of that hosted in private repositories. In this case some credentials are needed to access such packages. Please use the auth.json textarea to insert credentials, if a package is coming from a private repository. You can look here for more information.

  • Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
  • To use Composer is sometimes complicated. Especially for beginners.
  • Composer needs much resources. Sometimes they are not available on a simple webspace.
  • If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
  • Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Please rate this library. Is it a good library?

Example code of aldamr01/laravel-blade-sortable

Informations about the package laravel-blade-sortable

Laravel Blade Sortable

Latest Version on Packagist Total Downloads

Laravel Blade Sortable

Demo

Repo

demo

Installation

You can install the package via composer:

After the package is installed, make sure to add laravel-blade-sortable::scripts components next to your other scripts.

Requirements

Package requires SortableJs and AlpineJs to be installed in your application in order to enable sorting. Reach out to their respective documentation in order to set them up.

NOTE: SortableJs must be available at the window object level in Javascript. To do this, import the library using

window.Sortable = require('sortablejs').default

or use any other similar approach

Usage

The package provides 2 custom Blade components to enable sorting of DOM elements:

Sortable

laravel-blade-sortable::sortable is used as the wrapper element for your sortable/drag-and-drop items. It must be used to enclose the children it will enable sortable.

By default, the component renders a "div" as the wrapper node. You can customize this behavior by passing an as property to render the type of node you need.

NOTE: Any other attribute you pass along (class, id, alt, etc) will be added to the element

If you would like to use custom Blade component as a wrapper node, you can also do this by passing a component property.

Sortable Item

laravel-blade-sortable::sortable-item is used as the wrapper element for each item you want to enable sorting.

NOTE: Similar to laravel-blade-sortable::sortable, you can pass a as or component property to render the type of node or custom component you desire.

NOTE: Extra attributes like class, id, alt, etc can be passed along to and will be added to the item node.

As you may have noticed, every laravel-blade-sortable::sortable-item requires a sort-key property. This property will be used to keep track of the ordering of the elements. Should be unique too.

And that's it. You have now a sortable list rendered by Laravel Blade without any custom Javascript. 🔥

basic

That example looks awful though 😅. Because you can pass in any custom component or styling directly, you can customize the wrapper and item nodes according to your needs. Here's another example using TailwindCSS ❤️ and custom components

custom-component

Looks dope, right? 👌

Advanced Usage

As Form Input

The sort order of elements can be used alongside other input fields on form submissions. To enable this behavior, just pass a name prop to a laravel-blade-sortable::sortable component. The name should be the name of the input in your form.

By adding a name props, the component internally adds hidden inputs for each one of the items' sort-key.

as-form-input

Pretty neat! 👌

With Livewire

Into Livewire? It's awesome. We know.

You can use this package within your Livewire views and use the sorting information in the component.

To get "sort change" updates in your Livewire component, just add the attribute wire:onSortOrderChange to a x-laravel-blade-sortable::sortable component. Adding this attribute will hook the Livewire component when a sorting event happens and will call the specified method/callback.

In the example above, every time your items are sorted, the handleSortOrderChange method will be called passing as argument an array with your items' sort-key in the current order.

livewire

Extra info is passed along too, so you can check extra data when processing the sort order

Customization

To support some advanced features of SortableJs, it is possible to pass the following props to a laravel-blade-sortable::sortable component:

customization

Multiple Drop Zones

Wanting to have different drop zones to drag/drop/sort elements? We have you covered. 😎

Just add a group string prop to a laravel-blade-sortable::sortable component. Add the same prop to another laravel-blade-sortable::sortable component on the same page and BOOM! Done!

drag-drop

Enable/Disable sorting and/or drop

Use :allow-sort=true|false and :allow-drop=true|false to x-laravel-blade-sortable::sortable components to enable/disable sorting and/or drop of elements.

Both defaults to true.

disable-sort-drop

Testing

Changelog

Please see CHANGELOG for more information what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security

If you discover any security related issues, please email [email protected] instead of using the issue tracker.

Credits

License

The MIT License (MIT). Please see License File for more information.

All versions of laravel-blade-sortable with dependencies

PHP Build Version
Package Version
Requires php Version ^7.2|^7.3|^7.4|^8.0|^8.1|^8.2
illuminate/support Version ^7.0|^8.0|^9.0|^10.0
Composer command for our command line client (download client) This client runs in each environment. You don't need a specific PHP version etc. The first 20 API calls are free. Standard composer command

The package aldamr01/laravel-blade-sortable contains the following files

Loading the files please wait ....