I recently found myself needing sortablejs so I decided id try help the community out with this too below is a file containing the setup for a simple list and a simple list with handles.
Please note this is still been worked on, also this is used for getting you up to the point of having indexes in inputs so you can then submit forms etc
Big thanks to @t11 as the input indexes are from his tutorial.
sortable_dev.js.zip (1.1 KB)
To install place the following in your head tags:
<script src="https://raw.githack.com/SortableJS/Sortable/master/Sortable.js"></script>
Then if you choose to install the file you can just link to where you save the file at the bottom of your layout page for node (I used public):
<script src="sortable_dev.js"></script>
In the file is also some instructions on how to use but ill also post them here swell:
How To Use
By default this file is configured for a simple list.
Edit YOUR_ID for the id of your repeat region or wherever your data is displayed.
.counter is the class used to generate the new indexes and must be appled to a child of your data e.g tbody then you could use the tr tag with the class=“counter”
.cos is the class used to add the value to the input of a text field, you should apply this once in every repeat or section of data. Used on input tag class=“cos”
Comment out any sections you arent using other wise you will get errors as it cany find ids.
Make sure you have the sortable master script in your head tags and this script file at the bottom of your page (for node I placed this file below the content page include on the layout page just below bootstrap)