Using AJAX in a Widget to Sort items [closed]

The script you are loading will apply the sortable to all elements with the .mywidget-list class just after the document has loaded.

Once you drop your widget inside a sidebar, a new .mywidget-list element is created trough $.ajax, which cannot have your sortable function attached to it, because it’s new. If you save the widget, the form HTML gets replaced with $.ajax, so again a new element is created in the DOM.

There are two solutions that I know of:

1. Put your JS inside the form method (inline javascript)
2. Wrap your sortable call within a function that you hook on the ajaxComplete event. This means your function will run each time an ajax request completes. You might want to check here if the element already has a sortable attached, to avoid conflicts