I am using list.min.js for sorting the table column. It works fine till data is not refreshed again from database using .load() method. But after using .load() method my data successfully loaded but i am not able to sort it again.
Below is my HTML and JavaScript code.
HTML Code
<div class="table-responsive table-scrollable" data-toggle="list" data-list-values='["GroupID", "TestGroupName"]'>
<table class="table align-items-center table-flush table-hover" id="TableTestGroupName">
<thead class="thead-light sticky-top">
<tr>
<th class="sort" data-sort="GroupID">Group ID</th>
<th class="sort" data-sort="TestGroupName">Test Group Name</th>
</tr>
</thead>
<tbody class="list">
<tr class="lh-6">
<td>
<span class="GroupID text-muted">Col A 1</span>
</td>
<td>
<b class="TestGroupName">Col B 1</b>
</td>
</tr>
<tr class="lh-6">
<td>
<span class="GroupID text-muted">Col A 2</span>
</td>
<td>
<b class="TestGroupName">Col B 2</b>
</td>
</tr>
</tbody>
</table>
</div>
JavaScript
$('#TableTestGroupName tbody').load('<?php echo base_url()?>TestLibrary_Controller/LoadTestGroup');
$('#TableTestGroupName tbody').sortable();
I have used $('#TableTestGroupName tbody').sortable('refresh'); also but its not working.
Please help me.