Aca podiendo su apoyo, soy un novato en programación jquery y ando editando un template llamado Doodle, el cual tiene un bloque de paneles, en los cuales uno de ellos tiene accesiones como: Refrescar el contenido, fullcreen y eliminar el panel.
A esto funciona todo menos lo que más quiero el refresh. Ya que dentro de este panel cargo una tabla con datos de una BD mysql; me gustaria que cada 1 minuto me actualice cambios en dicha tabla.
Pero al revisar el codigo que figura en su init.js que es el que maneja el evento click de dicho panel, a pesar que refresca la vista del panel el contenido sigue igual a pesar que haya cambiado. Si le doy F5 a toda la pagina ahí recien veo el cambio en la tabla mostrada.
Les pongo un extracto de codigo que es el que usa el template.
Código :
/*Refresh Init Js*/
var refreshMe = '.refresh';
$(document).on("click",refreshMe,function (e) {
var panelToRefresh = $(this).closest('.panel').find('.refresh-container');
var dataToRefresh = $(this).closest('.panel').find('.panel-wrapper');
var loadingAnim = panelToRefresh.find('.la-anim-1');
panelToRefresh.show();
setTimeout(function(){
loadingAnim.addClass('la-animate');
},100);
function started(dataToRefresh){} //function before timeout
setTimeout(function(){
function completed(dataToRefresh){} //function after timeout
panelToRefresh.fadeOut(800);
setTimeout(function(){
loadingAnim.removeClass('la-animate');
},800);
},1500);
return false;
});Código :
<div class="panel panel-default card-view panel-refresh"> <div class="refresh-container"> <div class="la-anim-1"></div> </div> <div class="panel-heading"> <div class="pull-right"> <a href="#" class="pull-left inline-block refresh mr-15"> <i class="zmdi zmdi-replay"></i> </a> <a href="#" class="pull-left inline-block full-screen mr-15"> <i class="zmdi zmdi-fullscreen"></i> </a> <a class="pull-left inline-block close-panel" href="#" data-effect="fadeOut"> <i class="zmdi zmdi-close"></i> </a> </div> <div class="clearfix"></div> </div> <div id="collapse_1" class="panel-wrapper collapse in"> <div class="panel-body"> <a href="#" class="pull-left inline-block refresh mr-15"> <i class="zmdi zmdi-replay"></i> </a> <a href="#" class="pull-left inline-block full-screen mr-15"> <i class="zmdi zmdi-fullscreen"></i> </a> <a class="pull-left inline-block close-panel" href="#" data-effect="fadeOut"> <i class="zmdi zmdi-close"></i> </a> </div> <div class="clearfix"></div> </div> <div id="collapse_1" class="panel-wrapper collapse in"> <div class="panel-body"> <div class="table-wrap"> <div class="table-responsive"> <table id="datable_1" class="table table-hover display pb-30" > <thead> <tr> <th>Editar | Estado</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </div>
