JQuery - Problemas configuracion basica dataTables

 
Vista:
sin imagen de perfil

Problemas configuracion basica dataTables

Publicado por raul (3 intervenciones) el 16/02/2016 11:28:21
Buenas a todos,


estoy intentando implementar datatbles en una tabla, y me encuentro que no ejecuta bien las funciones basicas 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 difinida. Voy al codigo y la variable esta totalmente bien definida. Comento ese trozo de codigo y en la tabla que estoy creando, aparece solo la funcionalidad de busqueda pero mal ejecutada(snunca encuentra resultados).
Bien empiezo de nuevo, esta vez cargando los archivos con la url de dataTables.net como indica en su ejemplo. Pego el codigo 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 codigo ni nada ..
Ya me han explicado que la configuracion basica es sencilla, importas archivos jquery.js y datatables.js inicializas datatables asi:

<script>

$(document).ready(function() {
$('#Jtabla').DataTable();
} );

</script>



Y ya funcionaria la configuración basica.

Agradezco mucho la ayuda lo debo incluir en una aplicacion para fin de curso que me queda una semana para ello :)
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil

Problemas configuracion basica dataTables

Publicado por raul (3 intervenciones) el 16/02/2016 13:50:37
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):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
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 :)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Problemas configuracion basica dataTables

Publicado por raul (3 intervenciones) el 16/02/2016 15:23:07
Gracias por contestar.

Si, eso es como he comenzado. Simplemente incluyendo los dos archivos el .js de datatables y el jquery. He inicializado al id de mi tabla el objeto datatables. Todo como lo pone en la web. Y ahi es donde empieza a marcar errores, sin haber tocado nada de nada de los archivos de de datatables y jquery.

Me pasa dos situaciones( en ambar situacionesla tabla la tengo definida exactamente como en el ejemplo)
1ª Los archivos los estoy llamando a la web con la url. En este caso no da errores pero datatables no se ejecuta.

2ª Me descargo los archivos de la web. Y me salta el error. Comento la zona del error, se ejecuta datatables, pero las busquedas no las realiza con sentido. No pagina las paginas ni ordena las columnas.

Se ve muy sencilla la implementacion, pero algo debe haber en como configuro el archivo al que llamo a datatables ..no se :|
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Problemas configuracion basica dataTables

Publicado por DAVID (40 intervenciones) el 17/02/2016 08:36:17
Hola buenas,
En una web mia yo tengo metidas estas librerias:
1
2
3
<script type="text/javascript" language="javascript" src="<?echo base_url();?>js/jquery.dataTables.min.js"></script>
	<script type="text/javascript" language="javascript" src="<?echo base_url();?>js/jquery.dataTables.columnFilter.js"></script>
	<script type="text/javascript" language="javascript" src="<?echo base_url();?>js/jquery-DT-pagination.js"></script>

Y la llamada a la libreria es:
1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function() {
var oTable = $('#example1').dataTable({
       "aoColumns": [{"sType":"string"}, {"sType":"string"}, {"sType":"string"}, {"sType":"string"}, {"sType":"string"}, {"sType":"string"}, {"sType":"string"}, {"sType":"string"}]
	   ,"sDom": " t<'well aaaa' <<'col-md-8'p><'col-md-4 text-right'i>>"
	   ,"sPaginationType": "bootstrap"
	   ,"iDisplayLength": 20
	   ,"aaSorting": [[0,'asc'],[2,'asc']]
	   ,"bSort": true
        ]
 
	   });

A ver si te sirve a ti.

Un saludo,
David
paginas web economicas
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar