My solution for reordering repeatable items

[gerryahmadi]

Hi,

As we all know, repeatable is very useful to manage dynamic fields, especially for Page templates. And behind its power, it still has a minor shortcoming, which is the ability to reorder the item. Well, at least for now (v4.1). I also know by making the repeatable item draggable will have some issues for WYSIWYG editor, and maybe others as well.

So I want to share my simple solution to overcome that by adding some tool buttons to move the item onto other position, like this:

And, for the "on click" event of those buttons, I just use the jquery functions: insertBefore(), insertAfter(), prependTo(), appendTo(). That will move the entire item (or row) to a new position.

The script can be seen from here. To use it, after download just simply put the file to: resources/views/vendor/backpack/crud/fields/repeatable.blade.php under your project codes.

Hope this helps. Cheers ;)

[pxpm]

Hello @gerryahmadi ! Can't thank you more for sharing you solution! Bless 🙏

There are things that can't be coincidence, I've marked as ready for merge this morning Laravel-Backpack/CRUD#3685 that introduces reorderability in repeatable field. 😲

The looks and workings are a bit different from yours, but the end result is pretty much the same! Since you publicly shared your solution we now have the best of both worlds, a core solution and an alternative solution for people that values the move to last/first button , as that bit is not implemented in the PR I mentioned.

Once again, sharing is caring! Thank you so much 👍