Adding Jquery UI Selectable changes sorting behavoir

Putjes

After adding the Jquery UI Selectable functions for drag Multi select the sorting is not working very well any more. Any options?

    <script src="@Url.Content("~/Scripts/jQuery/jQuery-1-11-0.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jQuery/UI/jquery-ui-1.10.4.min.js")" type="text/javascript"></script>
    <link href="@Url.Content("~/Content/IGStyles/ig/jquery.ui.custom.css")" rel="stylesheet" type="text/css" />


    <!-- The block below is included for the MultipleSelectDropDown element. -->
    <script src="@Url.Content("~/Scripts/MultipleSelectDropDown.js")" type="text/javascript"></script>


    <!-- Script voor Datatables on Grid page-->
 <script src="@Url.Content("~/Scripts/jQuery/jquery.dataTables.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jQuery/jquery.DataTables.Tools.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/jquery.dataTables.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/jquery.dataTables.Tools.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/jquery.UI.Selectable.css")" rel="stylesheet" type="text/css" />

And the script

        var oTable
        var aTableData
        $(document).ready(function () {
                     oTable = $('#GridTabel').dataTable({
                            "columnDefs": [
                                {
                                    "targets": [0],
                                    "visible": false,
                                    "searchable": false
                                }
                            ],
                            "language": {
                                "emptyTable": "Geen gegevens gevonden",
                                "info": "Toont _START_ tot _END_ van _TOTAL_ records",
                                "infoEmpty": "Toont 0 tot 0 van 0 records",
                                "infoFiltered": "(Gefilterd uit _MAX_ totaal aantal records)",
                                "infoPostFix": "",
                                "thousands": ".",
                                "lengthMenu": "Toont _MENU_ records per pagina",
                                "loadingRecords": "Laadt...",
                                "processing": "Bezig...",
                                "search": "Zoeken:",
                                "zeroRecords": "Geen overeenkomende records gevonden",
                                "paginate": {
                                    "first": "Eerste",
                                    "last": "Laatste",
                                    "next": "Volgende",
                                    "previous": "Vorige"
                                }
                            },
                            dom:  'T<"clear">lfrtip',
                            tableTools: {
                                "sRowSelect": "multi",
                                "aButtons": ["select_all", "select_none"]
                            },
                            "searching": true,
                            "aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "Alles"]]
                     });
                     
                     /* Get the rows which are currently selected */
                     function fnGetSelected(oTableLocal) {
                         var aReturn = new Array();
                         var aTrs = oTableLocal.$('tr.DTTT_selected');
                         for (var i = 0 ; i < aTrs.length ; i++) {
                             aReturn.push(oTable.fnGetData(aTrs[i])[0]);
                         }
                         return aReturn;
                     }


                     $('#generate').click(function () {
                         showGridSelectionMessage(false);
                         var rowData = fnGetSelected(oTable);
                         console.log(rowData[0]);
                             if (rowData == null || rowData =='') {
                                 showGridSelectionMessage(true);
                             }
                             else {
                                 $("#reportId").val($("#reportsSingleSelect").val());
                                 $("#presentationFormId").val($("#presentationFormsSingleSelect").val());
                                 $("#selectedKeyIds").val(rowData);
                                 $("#reportForm").submit();
                             }
                        });
                   
                    //$('#GridTabel tbody').on('click', 'tr', function () {
                    //    $(this).toggleClass('selected');
                    //});

                   
                    //        $("#GridTabel").selectable({
                    //               filter: 'tr',
                    //               stop: function(){
                    //                   $(".ui-selected", this).each(function(){
                    //                       var index = $("#GridTabel tr").index(this) - 1;
                    //                       $('#GridTabel tbody tr:eq(' + index + ')').toggleClass('DTTT_selected selected');
                    //                       $('#GridTabel tbody tr:eq(' + index + ')').toggleClass('ui-selected');
                    //                   });
                    //               }
                    //           });
                    });

enabling the selectable part makes the sorting of the datatables go wrong. What can I do?

Regards,
Ronald.