2016-05-12 2 views
1

Когда я использую обработку на стороне сервера в 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 
        ] 
       }); 

Существует некоторая конфигурация, которую я здесь отсутствует. Я читал на datatable форумах, и единственная проблема, о которой говорили люди, заключалась в том, что ничья должна быть такой же, как и то, что мы отправляем на стороне сервера.

+0

Вы можете увидеть, если код сервер возвращает правильные данные? Возможно, вам придется посмотреть на «success: function (msg, a, b)» кода. –

+0

msg - это jsonResult, возвращаемый из базы данных, и это правильно. Я создаю данные для fnCallback, используя эту строку выше 'вар данных = { "рисовать": эхо, "recordsTotal": msg.Table2 [0] .TOTAL_NUMBER_OF_RECORDS, "recordsFiltered": msg.Table1 [0] .FILTERED_RECORDS , "data": mappedCusNames }; ' –

+0

В этом случае? Https: //datatables.net/forums/discussion/25552/sorting-icons-do-not-change-when-using-server-side-processing –

ответ

1

Для тех, кто ищет ответ на этот вопрос. Печально, но я должен был написать свою собственную функцию, как показано ниже:

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-> Колонка, на которой сортировка щелкнул (Datatable парам iSortCol_0)

sortDir -> направление сортировки (DataTable парам sSortDir_0)

Смежные вопросы