Estoy cargando tablas (datatables con Tabledit) de manera dinamica usando clases para hacer llamados, inicialmente lo tenia así:
$('.tabla').each(function() {
var $table = $(this);
var $dataTable = $table.DataTable({
"processing": true,
"serverSide": true,
"searching": false,
"paging": true,
"lengthMenu": [3,5,10],
"destroy":true,
"order": [],
"language": {
"emptyTable": "No hay datos disponibles",
"processing": "Cargando...",
"lengthMenu": "Mostrar _MENU_ registros",
"info": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
"paginate": {
"previous": "Anterior",
"next": "Siguiente"
}
},
"ajax": {
url: "fetch.php",
type: "POST"
}
});
// AGREGA Y EJECUTA BOTONES DE EDITAR, BORRAR
$table.on('draw.dt', function() {
$table.Tabledit({
url: 'action.php',
dataType: 'json',
columns: {
identifier: [0, 'id'],
editable: [
[1, 'first_name'],
[2, 'last_name'],
[3, 'gender', '{"1":"Male","2":"Female"}']
]
},
restoreButton: false,
onSuccess: function(data, textStatus, jqXHR) {
if (data.action == 'delete') {
$('#' + data.id).remove();
$('.tabla').DataTable().ajax.reload();
}
}
});
});
});
pero con toda la creacion de tablas y demas, este evento nunca es llamado y tengo entendido que cuando se crea codigo html desde jquery de manera dinamica, se debe de utilizar:
$(document).on('click','.tabla',function(){..... resto de codigo igual que el de arriba
y funciona, pero claramente la tabla (datatable y tabledit) aparecerán visualmente cuando haga click sobre su espacio, la pregunta es: COMO PUEDO HACER PARA QUE NO TENGA QUE HACER CLICK PARA QUE CARGUE LA TABLA SINO QUE CARGUE SOLA CUANDO INICIA LA PAGINA? QUE EVENTO DEBO DE CAMBIAR EN EL $(document).on('click
Dejo todo el codigo que tengo en el JS:
$(document).ready(function() {
$.getJSON('contenido.php', function(data) {
console.log(data);
for (i = 0; i < data.length; i++) {
$('#tab').append(ejes(i,data));
for (y = 0; y < data[i].objetivo.length; y++) {
$('#contenido'+i+'').append(objetivos(i,y,data));
for (x = 0; x < data[i].objetivo[y].meta.length; x++) {
$('#contenido'+i+y).append(formularios(i,y,x,data));
$('#contenido'+i+y+x).append(tablas());
}
}
}
});
// $documento.each('.tabla', function(){
$(document).ready('.tabla',function(){
// $('.tabla').each(function() {
console.log($(this));
var $table = $(this);
var $dataTable = $table.DataTable({
"processing": true,
"serverSide": true,
"searching": false,
"paging": true,
"lengthMenu": [3,5,10],
"destroy":true,
"order": [],
"language": {
"emptyTable": "No hay datos disponibles",
"processing": "Cargando...",
"lengthMenu": "Mostrar _MENU_ registros",
"info": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
"paginate": {
"previous": "Anterior",
"next": "Siguiente"
}
},
"ajax": {
url: "fetch.php",
type: "POST"
}
});
// AGREGA Y EJECUTA BOTONES DE EDITAR, BORRAR
$table.on('draw.dt', function() {
$table.Tabledit({
url: 'action.php',
dataType: 'json',
columns: {
identifier: [0, 'id'],
editable: [
[1, 'first_name'],
[2, 'last_name'],
[3, 'gender', '{"1":"Male","2":"Female"}']
]
},
restoreButton: false,
onSuccess: function(data, textStatus, jqXHR) {
if (data.action == 'delete') {
$('#' + data.id).remove();
$('.tabla').DataTable().ajax.reload();
}
}
});
});
});