JSFiddle - React, Tailwind, and code Playground

by arielblues

HTML

<ul id="sortable">
    <li id="item-1" data-attribute=""> <span></span> Item 1</li>
    <li id="item-2" data-attributes=""> <span></span>Item 2</li>
</ul>
Query string: <span></span>

JavaScript

$(document).ready(function () {
    $('ul').sortable({
        axis: 'y',
        
        stop: function (event, ui) {
	        var data = $(this).sortable('serialize');
            $('span').text(data);
            /*$.ajax({
                    data: oData,
                type: 'POST',
                url: '/your/url/here'
            });*/
            
             var ii = 1;
            
            $('li').each(function(ii) {
	var $this = $(this);
	var newClass = "sort" + ii++;
    $this.addClass(newClass);
});



 
            
            
            
	}
    });
});