Html5sortable drag and drop не работает при ajax-загрузке HTML

Я пытался добавить перетаскиваемый HTML список, который загружается через AJAX запрос, он не работает, вот код ниже для функции перетаскивания я использовал html5sortable

Код шаблона HTML

<script src="{% static 'assets/javascripts/libraries/html5sortable.min.js' %}"></script>
<script src="{% static 'assets/javascripts/main.js' %}"></script>

<div class="card-body" id="item-container">
            
</div>

JS код

$.ajax({
    URL: list_data_url,
    type: "POST",
    data: data,
    success: function (response) {
      if (response["success"] == true) {
        
      const parent = $("#item-container").empty();

        //  Added sortable DIV
        let item_html = '<div class="sortable">';
        let total_price = 0;
        for (const item of items) {
            item_html += `
                <a href="${details_url}">
                    <div class="item-wraper" style="background:${bk_color}; opacity:0.5;">
                        <div><strong>Items SL: </strong> Item Name</div>
                    </div> 
                </a>`;
        }
        
        item_html += "</div>";
        parent.append(item_html);

        // Items Sortable
        sortable(".sortable");
    }
}})

Вернуться на верх