在Datatable服务器端处理中排序图标不会更改

问题描述：

当我在数据表中使用服务器端处理时，排序工作正常，但排序图标不会更改并保持相同方向。以下是我的数据表配置的代码片段。在Datatable服务器端处理中排序图标不会更改

$('#dtSearchResult').DataTable({ 
        "filter": false, 
        "pagingType": "simple_numbers", 
        "orderClasses": false, 
        "order": [[0, "asc"]], 
        "info": true, 
        "scrollY": "450px", 
        "scrollCollapse": true, 
        "bLengthChange": false, 
        "searching": true, 
        "bStateSave": false, 
        "bProcessing": true, 
        "bServerSide": true, 
        "sAjaxSource": VMCreateExtraction.AppSecurity.websiteNode() + "/api/Collection/SearchCustIndividual", 
        "fnServerData": function (sSource, aoData, fnCallback) { 
         aoData.push({ "name": "ccUid", "value": ccUid }); 
         //Below i am getting the echo that i will be sending to Server side 
         var echo = null; 
         for (var i = 0; i < aoData.length; i++) { 
          switch (aoData[i].name) { 
           case 'sEcho': 
            echo = aoData[i].value; 
            break; 
           default: 
            break; 
          } 
         } 
         $.ajax({ 
          "dataType": 'json', 
          "contentType": "application/json; charset=utf-8", 
          "type": "GET", 
          "url": sSource, 
          "data": aoData, 
          success: function (msg, a, b) { 
           $.unblockUI(); 

           var mappedCusNames = $.map(msg.Table, function (Item) { 
            return new searchGridListObj(Item); 
           }); 
           var data = { 
            "draw": echo, 
            "recordsTotal": msg.Table2[0].TOTAL_NUMBER_OF_RECORDS, 
            "recordsFiltered": msg.Table1[0].FILTERED_RECORDS, 
            "data": mappedCusNames 
           }; 
           fnCallback(data); 
           $("#dtSearchResult").show(); 
           ko.cleanNode($('#dtSearchResult')[0]); 
           ko.applyBindings(VMCreateExtraction, $('#dtSearchResult')[0]); 
          } 
         }) 
        }, 
        "aoColumns": [{ 
         "mDataProp": "C_UID" 
        }, { 
         "mDataProp": "C_LAST_NAME" 
        }, { 
         "mDataProp": "C_FIRST_NAME" 
        }, { 
         "mDataProp": "C_USER_ID" 
        }, { 
         "mDataProp": "C_EMAIL" 
        }, { 
         "mDataProp": "C_COMPANY" 
        }], 
        "aoColumnDefs": [{ "defaultContent": "", "targets": "_all" }, 
       //I create a link in 1 st column 
        ] 
       });

有一些配置，我在这里失踪。我在数据表论坛上阅读，人们强调的唯一问题是绘制应该与我们在服务器端发送的相同。

你可以看到，如果服务器代码返回正确的数据？您可能需要查看代码的“成功：函数（msg，a，b）”。 –

msg是从数据库返回的jsonResult，它是正确的。创建的数据fnCallback使用该线以上 'VAR数据= { “画”：回声， “recordsTotal”：msg.Table2 [0] .TOTAL_NUMBER_OF_RECORDS， “recordsFiltered”：msg.Table1 [0] .FILTERED_RECORDS ， “data”：mappedCusNames };' –

是这样吗？https：//datatables.net/forums/discussion/25552/sorting-icons-do-not-change-when-using-server-side-processing –

答

对于任何寻找答案的人。伤心，但我不得不写下面我自己的函数：

function sortIconHandler(thArray, sortCol, sortDir) { 
 
     for (i = 0; i < thArray.length; i++) { 
 
      if (thArray[i].classList.contains('sorting_asc')) { 
 
       thArray[i].classList.remove('sorting_asc'); 
 
       thArray[i].classList.add("sorting"); 
 
      } 
 
      else if (thArray[i].classList.contains('sorting_desc')) { 
 
       thArray[i].classList.remove('sorting_desc'); 
 
       thArray[i].classList.add("sorting"); 
 
      } 
 
      if (i == sortCol) { 
 
       if (sortDir == 'asc') { 
 
        thArray[i].classList.remove('sorting'); 
 
        thArray[i].classList.add("sorting_asc"); 
 
       } 
 
       else { 
 
        thArray[i].classList.remove('sorting'); 
 
        thArray[i].classList.add("sorting_desc"); 
 
       } 
 
      } 
 
     } 
 
    }

tharrray->所有的行标头的数组（您可以只写这个jQuery选择）。

sortCol->列上排序点击（数据表PARAM iSortCol_0）

sortDir - >选方向（数据表PARAM sSortDir_0）

在Datatable服务器端处理中排序图标不会更改

相关推荐