jquery sortable not working on laravel blade

I am trying to add sortable cards in my laravel blade where you can move a card up and down using jquery sortable. But when I try to move it up or down it is not responding. this is my blade template.

<table id="table" class="">  
 <tbody id="tablecontents">     
@foreach ($city as $cit)
 <tr class="row1" data-id="">
 <div class="">
  <div class="card card-stats">
    <div class="  card-header card-header-info card-header-icon">
      <div style="    background: linear-gradient(60deg, #00acc1);"  class="   card-icon">
        
      </div>
  </div>
  </div>
</div>
 </tr>
@endforeach

 </tbody>

 </table> 

this is my function

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js"></script>

<script type="text/javascript">



 $(function () {
$("#table").DataTable();

$( "#tablecontents" ).sortable({
  items: "tr",
  cursor: 'move',
  opacity: 0.6,
  update: function() {
      sendOrderToServer();
  }
});

via Chebli Mohamed