<html lang="es" ng-app>
<head>
<!-- Require Gobal -->
<?php require("../require/head.require.php"); ?>
<!-- CSS -->
<?php require("../require/css.require.php"); ?>
<?php require("../require/insidecss.require.php"); ?>
</head>
<body>
<!-- Require Variables -->
<?php require("../require/get.require.php"); ?>
<?php require("../require/function.require.php"); ?>
<!-- GLobal -->
<div class="page-wrap">
<!-- Menu -->
<?php require("../require/menu.require.php"); ?>
<div class="container-fluid padding-container">
<!-- Breadcrumb -->
<?php require("../require/breadcrumb.php"); ?>
<div class="loader" id="loader">Loading...</div>
<!-- Border General -->
<div class="border-1-oscuro padding-10" id="content">
<div class="row">
<!-- Menu -->
<div class="col-md-6">
<div class="form-group">
<form class="form-inline my-2 my-lg-0" action="" method="post" name="filter" id="filter">
<input type="text" class="form-control" id="search" name="search" placeholder="Buscar Centro por Nombre" autocomplete="off">
</form>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<a class="btn btn-outline-success float-right" id="addClase" name="addClase" href="caddclase.php">Añadir Clase</a>
</div>
</div>
<div class="tab-content col-md-12" id="myTabContent">
<div class="tab-pane fade show active table-responsive" id="lista" role="tabpanel" aria-labelledby="dia-tab">
<!--Aca va la tabla de visualizacion de usuarios -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<?php require("../require/footer.require.php"); ?>
<!-- Modal -->
<?php
$modal = 'editClase';
require("../require/modal.require.php");
?>
<!-- JS -->
<?php require("../require/js.require.php"); ?>
<?php require("../require/insidejs.require.php"); ?>
<script type="text/javascript">
$(document).ready(function () {
mostrarClases();
$("#search").keyup(function(e){
mostrarClases();
});
});
function mostrarClases(){
datos = {
"opcion" : "mostrarClases",
"search": $('#search').val()
};
console.log(datos);
$.ajax({
url:'../controllers/clasesController.php',
type:'POST',
data: datos
}).done(function(response){
var data = JSON.parse(response).respuesta;
var msj = JSON.parse(response).msj;
var success = JSON.parse(response).success;
html="<table class='table table-bordered table-hover'><thead><tr><td><strong>Nombre clase</strong></td><td><strong>Tipo de servicio</strong></td><td><strong>Tipo de programa</strong></td><td><strong>Editar</strong></td><td><strong>Activo</strong></td></tr></thead><tbody>";
if(success){
var valores = eval(data);
for(i=0;i<valores.length;i++){
datos=valores[i][0]+"*"+valores[i][1]+"*"+valores[i][2]+"*"+valores[i][3]+"*"+valores[i][4]+"*"+valores[i][5]+"*"+valores[i][6]+"*"+valores[i][7]+"*"+valores[i][8]+"*"+valores[i][9]+"*"+valores[i][10]+"*"+valores[i][11]+"*"+valores[i][12]+"*"+valores[i][13]+"*"+valores[i][14]+"*"+valores[i][15]+"*"+valores[i][16]+"*"+valores[i][17]+"*"+valores[i][18];
html+="<tr><td>"+valores[i][9]+"</td><td>"+valores[i][12]+"</td><td>"+valores[i][11]+"</td><td><i id='edit' data-toggle='modal' data-target='#editarClase' style='cursor:pointer;' onclick='mostrarEditClase("+'"'+datos+'"'+");' class='fa fa-cog' aria-hidden='true'></i></td>";
if(valores[i][8] == 1){
html+='<td><div class="checkbox"><label style="padding-right: 30px;"><input type="checkbox" name="Estado" id="Estado'+valores[i][0]+'" onclick="cambiarEstado('+valores[i][0]+')" checked></label></div></td>';
}else if (valores[i][8] == 2 ){
html+='<td><div class="checkbox"><label style="padding-right: 30px;"><input type="checkbox" name="Estado" id="Estado'+valores[i][0]+'" onclick="cambiarEstado('+valores[i][0]+')"></label></div></td>';
}
}
html+="</tbody></table>"
$("#lista").html(html);
}else{
html+="<tr><td colspan='6'>"+msj+"</td></tr></tbody></table>"
$("#lista").html(html);
}
$("#loader").css("display", "none");
$("#content").css("display", "block");
});
}
function mostrarEditClase(datos){
console.log(datos);
var d=datos.split("*");
$("#Id_clase").val(d[0]);
$("#Nombre_clase").val(d[9]);
$("#Id_programa_actual").val(d[1]);
document.getElementById("Id_programa_actual").innerText = d[11];
$("#Id_servicio_actual").val(d[2]);
document.getElementById("Id_servicio_actual").innerText = d[12];
$("#Id_categoria_actual").val(d[3]);
document.getElementById("Id_categoria_actual").innerText = d[13];
$("#Id_subcategoria_actual").val(d[4]);
document.getElementById("Id_subcategoria_actual").innerText = d[14];
$("#Id_metas_actual").val(d[7]);
document.getElementById("Id_metas_actual").innerText = d[15];
$("#Id_nivel_actual").val(d[6]);
document.getElementById("Id_nivel_actual").innerText = d[16];
$("#Id_alcance_actual").val(d[5]);
document.getElementById("Id_alcance_actual").innerText = d[17];
Duracion = moment.duration(d[18]).asMinutes();
Duracion += " Minutos";
$("#Duracion_clase_actual").val(d[9]);
document.getElementById("Duracion_clase_actual").innerText = Duracion;
$("#Descripcion").val(d[10]);
}
function cambiarEstado(Id_clase){
var isChecked = document.getElementById("Estado"+Id_clase).checked;
if(isChecked){
var estado = 1;
}else{
var estado = 2;
}
datos = {
"opcion":"updateEstado",
"Id_clase":Id_clase,
"estado": estado
};
jQuery.ajax({
url: '../controllers/clasesController.php',
type: 'POST',
data: datos
})
.done(function(data){
var success = JSON.parse(data).success;
var msj = JSON.parse(data).msj;
if(success){
//alert(msj);
}else{
alert(msj);
}
})
.fail(function(resp){
console.log(resp.responseText);
})
}
$("#editarClase").on('hidden.bs.modal', function () {
$('#formEditClase').trigger("reset");
$('#Id_categoria').find('option').remove().end().append('<option value="" selected style="display: none;" id="Id_categoria_actual" name="Id_categoria_actual"></option>');
$('#Id_subcategoria').find('option').remove().end().append('<option value="" selected style="display: none;" id="Id_subcategoria_actual" name="Id_subcategoria_actual"></option>');
$('#Id_alcance').find('option').remove().end().append('<option value="" selected style="display: none;" id="Id_alcance_actual" name="Id_alcance_actual"></option>');
});
</script>
public function getListClases($datos)
{
require '../require/Conexion.php';
$search = $datos["search"];
$sql = "
SELECT cr.id_clase, cr.id_programa, cr.id_servicio, cr.id_categoria, cr.id_subcategoria,
cr.id_alcance,cr.id_nivel, cr.id_metas, cr.id_estatus, cr.nombre_clase, cr.descripcion,
pg.nombre_programa, sv.nombre_servicio, cs.nombre_categoria, sc.nombre_subcategoria,
mt.nombre_metas, nv.nombre_nivel, ac.nombre_alcance, cr.duracion_clase
FROM ec_clase_raiz AS cr
INNER JOIN ec_estatus AS es ON (cr.id_estatus = es.id_estatus)
INNER JOIN ec_programa AS pg ON (cr.id_programa = pg.id_programa)
INNER JOIN ec_servicio AS sv ON (cr.id_servicio = sv.id_servicio)
INNER JOIN ec_categoria_servicio AS cs ON (cr.id_categoria = cs.id_categoria)
INNER JOIN ec_subcategoria_servicio as sc ON (cr.id_subcategoria = sc.id_subcategoria)
INNER JOIN ec_metas AS mt ON (cr.id_metas = mt.id_metas)
INNER JOIN ec_nivel AS nv ON (cr.id_nivel = nv.id_nivel)
INNER JOIN ec_alcance AS ac ON (cr.id_alcance = ac.id_alcance)
WHERE cr.nombre_clase LIKE '%$search%'
ORDER BY cr.nombre_clase ASC;";
$result = @mysqli_query($mysqli, $sql); // or die(mysqli_error($conn));
if (!$result) {
return null;
}
$numeroFilas = mysqli_num_rows($result);
if ($numeroFilas <= 0) {
return null;
} else {
while ($resultado = mysqli_fetch_array($result)) {
$arreglo[] = $resultado;
}
return $arreglo;
}
mysqli_close($mysqli);
}
Edit:
Hice lo que me dijeron pero ahora tengo un error con "JSON.parse: unexpected non-whitespace character after JSON data at line 1 column 3 of the JSON data" y todavía no muestra la separación de parrafos. mostrarEditClase tiene ese problema
Si preguntan, los datos vienen asi 13 * 1 * 1 * 35
function mostrarEditClase(datos){
var d = JSON.parse(datos);
$("#Id_clase").val(d[0]);
$("#Nombre_clase").val(d[9]);
$("#Id_programa_actual").val(d[1]);
document.getElementById("Id_programa_actual").innerText = d[11];
$("#Id_servicio_actual").val(d[2]);
document.getElementById("Id_servicio_actual").innerText = d[12];
$("#Id_categoria_actual").val(d[3]);
document.getElementById("Id_categoria_actual").innerText = d[13];
$("#Id_subcategoria_actual").val(d[4]);
document.getElementById("Id_subcategoria_actual").innerText = d[14];
$("#Id_metas_actual").val(d[7]);
document.getElementById("Id_metas_actual").innerText = d[15];
$("#Id_nivel_actual").val(d[6]);
document.getElementById("Id_nivel_actual").innerText = d[16];
$("#Id_alcance_actual").val(d[5]);
document.getElementById("Id_alcance_actual").innerText = d[17];
Duracion = moment.duration(d[18]).asMinutes();
Duracion += " Minutos";
$("#Duracion_clase_actual").val(d[9]);
document.getElementById("Duracion_clase_actual").innerText = Duracion;
$("#Descripcion").val(d[10]);
document.getElementById("Descripcion").innerText = d[10];
}