I have tried a very simple example with Sortable.js: Two lists: One is currently empty, and will store item copies from the other list (which is static).
I tried defining pull and put values for each list, defining the same group name, but it does not work. In fact the static elements from the filled list are not draggable at all.
I have written the example at JSbin. Since I am new to JS, I accept all kind of constructive comments.
BTW: any way of drawing the bootstrap list borders even when empty?
I have edited the jsbin and did the following corrections
Replaced the sortable.js with
<script src="//cdn.jsdelivr.net/sortable/latest/Sortable.min.js"></script>
You were accessing the ids with _ (instances_list, main_list) whereas the ids were having an -
For the appending to work I had to add one item by default to instances-list than keeping it empty