JQuery Datatables: Não é possível ler a propriedade 'aDataSort' de indefinido


95

Eu criei este fiddle para e ele funciona bem de acordo com meus requisitos: Fiddle

No entanto, quando eu uso o mesmo em meu aplicativo, recebo um erro no console do navegador dizendo Não é possível ler a propriedade 'aDataSort' de undefined

No meu aplicativo, o javascript é mais ou menos assim: Eu verifiquei a saída do controlador ... funciona bem e está impresso no console também.

$(document).ready(function() {

    $.getJSON("three.htm", function(data) {
             // console.log("loadDataTable >>  "+JSON.stringify(data));
             })
             .fail(function( jqxhr, textStatus, error ) {
             var err = textStatus + ', ' + error;
             alert(err);
             console.log( "Request Failed: " + err);
             })
             .success(function(data){
                 loadDataTable(data);
             });

    function loadDataTable(data){
         $("#recentSubscribers").dataTable().fnDestroy();    
         var oTable = $('#recentSubscribers').dataTable({
             "aaData" : JSON.parse(data.subscribers),
             "processing": true,
            "bPaginate": false,
            "bFilter": false,
            "bSort": false,
            "bInfo": false,
            "aoColumnDefs": [{
            "sTitle": "Subscriber ID",
            "aTargets": [0]
        }, {
            "sTitle": "Install Location",
            "aTargets": [1]
        }, {
            "sTitle": "Subscriber Name",
            "aTargets": [2]
        }, {
            "aTargets": [0], 
            "mRender": function (data, type, full) {
                return '<a style="text-decoration:none;" href="#" class="abc">' + data + '</a>';
            }
        }],
            "aoColumns": [{
            "mData": "code"
        }, {
            "mData": "acctNum"
        }, {
            "mData": "name"
        }]
            });

    }       

})

Certifique-se de que o código que você incluiu é igual ao violino (não é) e ao que você está executando. Também no violino você tem dois aTargets [0], verifique: jsfiddle.net/gL0p0t42
Leandro Carracedo

Você não está fornecendo a fonte que realmente chama "aDataSort".
Daniel de

Você quer dizer o id da tabela html? Eu cuidei disso. Deixe-me tentar ter um alvo.
swateek

@Daniel a fonte é o parâmetro para a função loadDataTable ().
swateek

Respostas:


130

É importante que seu THEAD não esteja vazio na tabela. Como dataTable, você deve especificar o número de colunas dos dados esperados. De acordo com seus dados, deve ser

<table id="datatable">
    <thead>
        <tr>
            <th>Subscriber ID</th>
            <th>Install Location</th>
            <th>Subscriber Name</th>
            <th>some data</th>
        </tr>
    </thead>
</table>

26
E se eu tiver um requisito que envolve a configuração de colunas e o número dessas colunas em tempo de execução? Como posso implementar o código para o requisito mencionado?
CS Lewis

Isso me ajudou a curar meu problema de dados não impressos. Bem, também me ajudou a curar mais um problema meu para a tabela de dados onde escrevi "Sort":false, então foi capaz de ver a lista em ordem decrescente que veio do controlador como Model.OrderByDescending(x=>x.Action==0).ThenBy(x=>x.Action).
Sorangwala Abbasali

2
o <thead>deve conter a <tr>, então <th>s
brahimm

Isso é verdade para um DataTable padrão (e resolve meu problema). RE: @CSLewis: Não tenho certeza com tabelas estáticas, mas se você estiver configurando colunas em tempo de execução junto com uma solicitação ajax, não é necessário ter nada, <thead>mas você deve definir as colunas em sua iniciação DataTable () assim: datatables .net / reference / option / columns.data
Harvey Dobson

59

Também tive este problema, esta matriz estava fora do intervalo:

order: [1, 'asc'],

1
Este sempre me pega. Existe uma maneira de padronizar a matriz para 0, se a matriz estiver fora do intervalo?
JGreasley

6
@JGreasley Você pode defini-lo como uma matriz vazia: ordem: []
hogarth45

2
Minhas colunas onde 5 e eu estávamos especificando 7 aqui! Obrigado
aiffin

1
1! Semana! Uma semana inteira! E essa é uma semana de 7 dias! E eu tenho certeza que eu estava não trabalhar 9-to-5, mais parecido com 9 a meia-noite ... tudo isso perdeu , porque eu não sabia sobre esse bug !! Arrrrrrrrrrrgh !! ... Tanto tempo perdido, eu me sinto profundamente envergonhado, eu pesquisei na Internet repetidamente e experimentei todas as soluções possíveis - nenhuma chegaria nem perto de 'consertar' isso. E então ... por mero acaso e já desesperado ... me deparei com sua resposta, e ta-da! Em cinco minutos, tudo foi consertado . Se eu fosse rico, enviaria um cheque de € 10K - risos
Gwyneth Llewelyn

9

Para mim, o bug estava no próprio DataTables; O código para classificação em DataTables 1.10.9 não verificará os limites; portanto, se você usar algo como

order: [[1, 'asc']]

com uma tabela vazia, não há linha idx 1 -> esta exceção garante. Isso aconteceu porque os dados da tabela estavam sendo buscados de forma assíncrona. Inicialmente, no carregamento da página, a dataTable é inicializada sem dados. Ele deve ser atualizado posteriormente, assim que os dados do resultado forem obtidos.

Minha solução:

// add within function _fnStringToCss( s ) in datatables.js
// directly after this line
// srcCol = nestedSort[i][0];

if(srcCol >= aoColumns.length) {
    continue;
}

// this line follows:
// aDataSort = aoColumns[ srcCol ].aDataSort;

Obrigado por sua elaboração sobre este assunto; @ hogarth45 acima identificou o problema / bug corretamente, mas não foi tão claro sobre por que isso era, de fato, um problema. Estou respondendo dois anos depois ... e aparentemente isso não foi corrigido, nem mesmo mencionado na documentação oficial, pelo menos, pelo que eu sei.
Gwyneth Llewelyn

7

Eu enfrentei o mesmo problema, as seguintes mudanças resolveram meu problema.

$(document).ready(function() {
     $('.datatable').dataTable( {
            bSort: false,
            aoColumns: [ { sWidth: "45%" }, { sWidth: "45%" }, { sWidth: "10%", bSearchable: false, bSortable: false } ],
        "scrollY":        "200px",
        "scrollCollapse": true,
        "info":           true,
        "paging":         true
    } );
} );

a aoColumnsmatriz descreve a largura de cada coluna e suas sortablepropriedades.

Outra coisa para mencionar esse erro também aparecerá quando você ordenar por um número de coluna que não existe.


4

No meu caso eu tive

$(`#my_table`).empty();

Onde deveria estar

$(`#my_table tbody`).empty();

Nota: no meu caso tive que esvaziar a tabela porque tinha os dados que queria antes de inserir novos dados.

Pensei em compartilhar onde "pode" ajudar alguém no futuro!


1

Eu tive esse problema porque outro script estava excluindo todas as tabelas e as recriando, mas minha tabela não estava sendo recriada. Passei muito tempo pensando nesse assunto antes de perceber que minha mesa nem mesmo estava visível na página. Você pode ver sua tabela antes de inicializar DataTables?

Essencialmente, o outro script estava fazendo:

let tables = $("table");
for (let i = 0; i < tables.length; i++) {
  const table = tables[i];
  if ($.fn.DataTable.isDataTable(table)) {
    $(table).DataTable().destroy(remove);
    $(table).empty();
  }
}

E deveria estar fazendo:

let tables = $("table.some-class-only");
... the rest ...

1

Você precisa mudar as aspas simples [']para aspas duplas ["]por causa da análise

se você estiver usando o atributo data-order na tabela, use-o assimdata-order='[[1, "asc"]]'


não é relevante com a pergunta do OP, mas funciona no meu caso (usando atributos de dados html 5)
blackbiron

-1

No meu caso resolvi o problema estabelecendo um número de coluna válido ao aplicar a orderpropriedade dentro do script onde você configura a tabela de dados.

var table = $('#mytable').DataTable({
     .
     .
     .
     order: [[ 1, "desc" ]],

Já existem outras respostas dizendo basicamente a mesma coisa. Tente evitar respostas redundantes a perguntas antigas.
thelr
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.