jQuery DataTables 렌더링 열 데이터

Question

JSON 인코딩 된 PHP 응답의 정보를 표시하기 위해 jQuery DataTables를 사용하고 있습니다. JSON 응답에는 "name"개체가 포함되어 있습니다. "이름"은 "성명", "성", "ID"를 포함합니다. 나는 원하는 방식으로 데이터를 표시하기 위해 columns을 사용했지만, 알아낼 수없는 문제가 발생했습니다.

아래 예제 코드에서 "성"별로 정렬하는 동안 "전체 이름"이 표시됩니다. 그러나 예제 2는 전혀 작동하지 않습니다. 원하는 결과물에는 HTML 렌더링 된 표시가 포함되고 "성"으로 정렬됩니다. 예제 3에서는 디스플레이가 원하는 방식으로 렌더링되었지만 올바르게 정렬되지 않았습니다.

누구든지 찾고있는 것을 출력하기 위해 예제 2를 조정하는 방법을 알고 있습니까 (렌더링 및 정렬 된 데이터)?

var oTable = $('#table').DataTable({ 
'ajax': { 
    url: 'PHP-file-returns-JSON.php', 
    type: "POST", 
    dataSrc: function (data) { 
      return data.cols; 
     },  
    data: function(d) { 

     ///send additional values to POST 
     var frm_data = $('#val1, #val2').serializeArray(); 
     $.each(frm_data, function(key, val) { 
      d[val.name] = val.value; 
     }); 
    } 
}, 
'columns':[ 

     // exapmle 1 - works but not rendered with HTML 
     { data: { 
       _: "name.Full Name", 
       sort: "name.Last Name", 
       } 
     }, 

     // example 2 not working at all 
     { data: 'name', "render": function (data, type, row) { 
       return '<span id="'+data.ID+'">'+data.Full Name+'</span>'; 
      }, 
      "sort" : "name.Last Name", 
     }, 

     // example 3 works fine with HTML rendered display but not sorted 
     { data: 'name', "render": function (data, type, row) { 
       return '<span id="'+data.ID+'">'+data.Full Name+'</span>'; 
      } 
     }, 
] 
}); 

UPDATE :

HERE 내가 함께 일하고 있어요 데이터 구조를 보여줍니다 JSFiddle입니다. 작업 예제에는 성으로 정렬 된 전체 이름 만 표시됩니다. 디스플레이에 id 속성으로 ID가 포함 된 스팬 요소를 포함시키는 방법을 파악하려고합니다. 마지막 이름에 열을 정렬해야하는 경우

Answer 1

name.Full Name을 사용하면 작동하지 않습니다. 공백없이 name.FullName이어야합니다. 여기 나를 위해 일한 것이 있습니다.

'columns': [ 
     { 
      "data": "name",     
      "render": function (data, type, row) { 
       if(type === 'display'){ 
        return '<span id="'+data.ID+'">'+data.FullName+'</span>'; 
       }else if(type === 'sort'){ 
        return data.LastName; 
       }else{ 
        return data; 
       } 
      } 
     } 
    ] 

Answer 2

이 작동합니다 : 그것은 here을 일하고

$.extend($.fn.dataTableExt.oSort, { 
    "last-name-pre": function(a) { 
    return $(a).data("lastname"); 
    }, 
    "last-name-asc": function(a, b) { 
    return ((a < b) ? -1 : ((a > b) ? 1 : 0)); 
    }, 
    "last-name-desc": function(a, b) { 
    return ((a < b) ? 1 : ((a > b) ? -1 : 0)); 
    } 
}); 


$("#example").DataTable({ 
    "data": data, 
    "columns": [{ 
    "title": "Full Name", 
    "data": "Full Name", 
    "render": function(data, type, row) { 
     return $("<span></span>", { 
     "text": data, 
     "data-lastname": row["Last Name"] 
     }).prop("outerHTML"); 
    }, 
    "type": 'last-name' 
    }] 
}); 

. 또한 렌더링 기능을 제거하고 단지 전체 이름을 분할하는 last-name 기능을 적응하고 성 반환 할 수 : here입니다

$.extend($.fn.dataTableExt.oSort, { 
    "last-name-pre": function(a) { 
    return a.split(" ")[1]; 
    }, 
    "last-name-asc": function(a, b) { 
    return ((a < b) ? -1 : ((a > b) ? 1 : 0)); 
    }, 
    "last-name-desc": function(a, b) { 
    return ((a < b) ? 1 : ((a > b) ? -1 : 0)); 
    } 
}); 


$("#example").DataTable({ 
    "data": data, 
    "columns": [{ 
    "title": "Full Name", 
    "data": "Full Name", 
    "type": 'last-name' 
    }] 
}); 

합니다. 희망이 도움이되고, 당신의 요구 사항을 올바르게 이해했습니다.