Problema con inicializacion basica de dataTables

Buenas a todos,

Estoy intentando implementar datatbles en una tabla, y me encuentro que no ejecuta bien las funciones básicas de dataTables(filtrado, paginacion. ordenacion) porque me indica el navegador de que tal variable no esta inicializada.

Me explico más profundamente, si me descargo los archivos de la web de dataTables.net me da un error en el archivo de jquery.datatables.js ---> me indica que la variable col en la fila 6448 no esta definida. Voy al codigo y la variable esta totalmente bien definida. Comento ese trozo de código y en la tabla que estoy creando, aparece solo la funcionalidad de búsqueda pero mal ejecutada (nunca encuentra resultados).

Bien empiezo de nuevo, esta vez cargando los archivos con la url de dataTables.net como indica en su ejemplo. Pego el código de Javascript que aparece en el ejemplo. Cambio el nombre id de mi tabla. Y esta vez el error me aparece en el archivo jquerydatatables.min.js que la variables c no esta definida . Y sin tocar código ni nada .. Ya me han explicado que la configuración básica es sencilla, importas archivos jquery.js y datatables.js inicializas datatables así:

<script>
$(document).ready(function() {
    $('#Jtabla').DataTable();
} );
</script>

Y ya funcionaría la configuración básica.

Agradezco mucho la ayuda lo debo incluir en una aplicación para fin de curso que me queda una semana para ello :)

Respuestas

Tras darme cuenta que podia ser por la estructura de la tabla( Thead, tr, td que coincidan con el ejemplo) tras hacer las modificaciones necesarias, la cosa mejora pero lanza un error: la variable nTd no esta definida en la linea 1770. No he tocado en ningun momento el archivo de datatables.js que es el que da el error.

Pego el codigo por si encuentran el error(pego todo el codigo que hace referencia a la variable nTd):

function _fnCreateTr ( oSettings, iRow, nTrIn, anTds )
    {
        var
            row = oSettings.aoData[iRow],
            rowData = row._aData,
            cells = [],
            nTr, nTd, oCol,
            i, iLen;
 
        if ( row.nTr === null )
        {
            nTr = nTrIn || document.createElement('tr');
 
            row.nTr = nTr;
            row.anCells = cells;
 
            /* Use a private property on the node to allow reserve mapping from the node
             * to the aoData array for fast look up
             */
            nTr._DT_RowIndex = iRow;
 
            /* Special parameters can be given by the data source to be used on the row */
            _fnRowAttributes( oSettings, row );
 
            /* Process each column */
            for ( i=0, iLen=oSettings.aoColumns.length ; i<iLen ; i++ )
            {
                oCol = oSettings.aoColumns[i];
 
                nTd = nTrIn ? anTds[i] : document.createElement( oCol.sCellType );
                nTd._DT_CellIndex = {
                    row: iRow,
                    column: i
                };
 
                cells.push( nTd );
 
                // Need to create the HTML if new, or if a rendering function is defined
                if ( (!nTrIn || oCol.mRender || oCol.mData !== i) &&
                     (!$.isPlainObject(oCol.mData) || oCol.mData._ !== i+'.display')
                ) {
                    nTd.innerHTML = _fnGetCellData( oSettings, iRow, i, 'display' );
                }
 
                /* Add user defined class */
                if ( oCol.sClass )
                {
                    nTd.className += ' '+oCol.sClass;
                }
 
                // Visibility - add or remove as required
                if ( oCol.bVisible && ! nTrIn )
                {
                    nTr.appendChild( nTd );
                }
                else if ( ! oCol.bVisible && nTrIn )
                {
                    nTd.parentNode.removeChild( nTd );
                }
 
                if ( oCol.fnCreatedCell )
                {
                    oCol.fnCreatedCell.call( oSettings.oInstance,
                        nTd, _fnGetCellData( oSettings, iRow, i ), rowData, iRow, i
                    );
                }
            }
 
            _fnCallbackFire( oSettings, 'aoRowCreatedCallback', null, [nTr, rowData, iRow] );
        }
 
        // Remove once webkit bug 131819 and Chromium bug 365619 have been resolved
        // and deployed
        row.nTr.setAttribute( 'role', 'row' );
    }

Gracias por las ideas para solucionarlo :)

@Rauldajani

16 febrero 2016, 13:47

Hola @Rauldajani,

A mi me ha pasado algo parecido con algunos plugins de jQuery, aunque siga los ejemplos, copie y pegue, a veces me sale uno que otro error como el que mencionas y me he dado cuenta que estos errores aparecen porque los archivos js no se cargan en el orden que deben cargarse.

Revisa el orden en que se están cargando tus js, quizá eso sea el problema,

saludos,

@miguelplazasr

16 febrero 2016, 18:48