Quiero crear unas pestañas a partir de unos datos consultados en la base de datos, en cada pestaña tendrá unos checkbox
los cuales quiero que tengan una acción onChange
pero no puedo insertar la etiqueta script
en una cadena string
function GenerarPestanias() {
var pestanias = '<ul class="nav nav-tabs" role="tablist">';
$.each( todoFunciones, function( i, j ){
if(i!=0){
if(j.id_padre==0){
var ident = j.titulo.toLowerCase().replace(/\s/g,'');
$.each( todoFunciones, function( x, y ){
if(y.id_padre==j.id){
}
});
pestanias += ''+
'<li><a href="#'+ident+'" data-toggle="tab" aria-expanded="true">'+j.titulo+' '+
'<input id="menu_'+ident+'" name="menu_'+ident+'" data-info="general" name="my-checkbox" type="checkbox" data-toggle="toggle" data-on="<span class=\'fa fa-power-off\'></span>" data-off="<span class=\'fa fa-power-off\'></span>" data-onstyle="success" data-offstyle="danger">'+
'</a>'+
'</li>'+
'<script type="text/javascript">'+
'</script>';
}
}
});
pestanias += '</ul>';
return pestanias;
}
Al finalizar la etiqueta del script me lanza error.
No se si es la manera correcta, si hay otra y mejor, bienvenida sera.
Actualización 1:
Quisiera que cada checkbox contenga algo como esto:
$('#checkbox').on("change", function(){
if($(this).prop("checked") == true){
alert(true);
}else{
alert(false);
}
});
Actualización 2:
No explique bien lo que quiero que haga cada checkbox, pues como dije arriba creo pestañas con bootstrap ( como acá ) a partir de una consulta a la BD, la tabla se compone de la siguiente manera:
CREATE TABLE public.funciones
(
id integer NOT NULL DEFAULT nextval('funciones_id_seq'::regclass),
id_padre integer NOT NULL,
icono character varying(255) NOT NULL,
link character varying(255) NOT NULL,
titulo character varying(255) NOT NULL,
status boolean NOT NULL
)
Los que contienen id_padres = 0
son las pestañas, las que contengan id_padres > 0
son hijos los cuales quiero que aparezcan dentro del contenido de cada pestaña también como checkbox.
Acá un ejemplo de una consulta (typo json) a la tabla
todoFunciones =
[
{
"id": 1,
"id_padre": 0,
"icono": "fa fa-dashboard fa-fw",
"link": "/",
"titulo": "Tablero",
"status": true
},
{
"id": 2,
"id_padre": 0,
"icono": "fa fa-tasks fa-fw",
"link": "#",
"titulo": "Procesos",
"status": true
},
{
"id": 3,
"id_padre": 2,
"icono": "fa fa-list-ol fa-fw",
"link": "/lotes",
"titulo": "Lotes",
"status": true
},
{
"id": 4,
"id_padre": 2,
"icono": "fa fa-eraser fa-fw",
"link": "/limpieza",
"titulo": "Limpieza",
"status": true
},
{
"id": 5,
"id_padre": 2,
"icono": "fa fa-stop fa-fw",
"link": "/paradas",
"titulo": "Paradas",
"status": true
},
{
"id": 6,
"id_padre": 2,
"icono": "fa fa-wrench fa-fw",
"link": "#",
"titulo": "Mantenimiento",
"status": true
}
]
;
on
es que puedes programar controles que van a aparecer dinamicamente