sorting is not working after using .load() list.js & jQuery

211 Views Asked by At

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.

0

There are 0 best solutions below