Estoy usando datatables
para mostrar ciertos datos; la función es la siguiente:
Uso un select
que me lista los grupos de un colegio el cual al seleccionar el GRUPO B me hace un CHANGE
y me arroja los datos en una tabla que tiene esta estructura:
(nombre,apellido,numero_identificación,calificación,editar)
En la columna editar
, hay un botón que me redirige a una pestaña nueva, la cual ahí voy a editar los datos del estudiante que seleccione, principalmente la calificación.
Problema:
Lo que deseo es que cuando yo actualice la calificación (Ej: si tenia calificación BUENO
pues se actualizara a EXCELENTE
) cuando la cierre o vuelva a la pestaña donde esta la tabla automáticamente se actualice y no tenga que oprimir quizás un F5
para tener que volver hacer un select
y que me arroje los datos nuevamente actualizados.
Este es el código:
Ajax select GRUPOS
$.ajax({
url: 'listar_grupos',
type: 'POST'
})
.done(function(response)
{
var result = $.parseJSON(response);
for (var i = result.length - 1; i >= 0; i--)
{
var name= result[i].desc_group;
$("#selecgrupo").append("<option value='" + result[i].id_group "'>" + name + "</option>");
$("#selecgrupo").selectpicker('refresh');
}
})
.fail(function() {
console.log("error");
});
Ajax para mostrar la tabla de datos (CHANGE)
listar_datos();
function listar_students()
{
$("#table_students").change(function()
{
$.ajax({
url: 'listar_students',
type: 'POST',
data: {id_group:this.value}
})
.done(function(response)
{
var result= $.parseJSON(response);
table_students.rows().remove();
for (var i = result.length - 1; i >= 0; i--)
{
var rowNode = table_students
.row.add([
result[i].id_group,
result[i].stu_nombre,
result[i].stu_apellido,
result[i].stu_identificacion,
result[i].stu_calificacion,
'<center><button type="button" name="viewdata" id="viewdata" class="btn btn-warning"><span class="glyphicon glyphicon-file"></span></center></button>',
])
.draw()
.node();
}
})
.fail(function() {
console.log("error");
});
});
}
Botón que me envía a la nueva pestaña, mostrándome los datos del estudianoe seleccionado.
$('#table_students tbody').on( 'click', '#viewdata', function ()
{
event.preventDefault();
var data = table_students.row( $(this).parents('tr') ).data();
var id_group = data[0];
window.open('../students/process_calificacion/' + id_group , '_blank');
});