I have a form to filter the data to generate graphs of survey data
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0-rc.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>
</head>
<body>
<br /><br />
<form id="formulario" class="form-inline" method="post" style="margin-left: 5%;">
<div class="form-group">
<label >Seleccione Asignatura:</label>
<input class="form-control" name="cursos" id="autocomplete">
</div>
<div class="form-group">
<input class="form-control" id="cod_curso" name="cod_curso" style="display:none;">
</div>
<div id="secciones" class="form-group"></div>
<div class="form-group">
<label for="sel1">Seleccione año:</label>
<select class="form-control" name="anio" id="anio" placeholder="" required>
<option value=2015>2015
<option value=2016>2016
<option value=2017>2017
<option value=2018>2018
<option value=2019>2019
</select>
</div>
<div class="form-group">
<label for="sel1">Seleccione semestre:</label>
<select class="form-control" name="semestre" id="semestre" placeholder="" required>
<option value=Primer>Primer
<option value=Segundo>Segundo
</select>
</div>
<div class="form-group text-center" style="margin-left: 50px;">
<button id="myButton" type="button" class="btn btn-default">Generar</button>
</div>
</form>
<div id="grafico"></div>
</body>
</html>
<script src="//code.jquery.com/ui/1.12.0-rc.1/jquery-ui.js"></script>
<script>
$(document).on('ready',function(){
$('#myButton').click(function(){
var url = "grafico_prueba.php";
$.ajax({
type: "POST",
url: url,
data: $("#formulario").serialize(),
success: function(data)
{
$('#grafico').html(data);
}
});
});
});
</script>
<script>
var Cursos = [
<?php
$query2 = $mysqli -> query ("SELECT DISTINCT cod_ramo FROM cursos");
$cantidad_cursos = mysqli_num_rows($query2);
$i = 1;
while ($valores2 = mysqli_fetch_array($query2)) {
echo "'" . $valores2['cod_ramo'] . "'";
if($i < $cantidad_cursos) {
echo ", ";
$i++;
}
}
?>
]
$("#autocomplete").autocomplete({
source: Cursos,
select: function(event, ui) {
$.ajax({
url: "secciones.php",
method: "GET",
data: {
cod_ramo: ui.item.value
},
success: function(data) {
$('#secciones').html(data);
}
});
}
});
</script>This form has an ajax to nest subject with sections and another to find the unique key of that course (cod_curso) that is hidden.
and then that input values I need to pass it to a highchart graphic
grafico_prueba.php
<script>
Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Grafico'
},
xAxis: {
min: 0,
title: {
text: 'Pregunta'
}
},
xAxis: {
categories: [
<?php
$sql = "SELECT * FROM preguntas";
$result = mysqli_query($mysqli,$sql);
while ($registros = mysqli_fetch_array($result))
{
?>
'<?php echo $registros["nombre"] ?>',
<?php
}
?>]
},
yAxis: {
min: 0,
title: {
text: 'Porcentajes'
}
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
shared: true
},
plotOptions: {
column: {
stacking: 'percent'
}
},
series: [{
name: 'no aplica',
data: <?php
$sql = "FROM preguntas p
LEFT JOIN tipo_respuesta tr on p.id_pregunta = tr.id_pregunta
LEFT JOIN respuesta r on tr.id_tipo = r.id_tipo
LEFT JOIN form_alumnos f on r.id_form_alumno_fk = f.id_form_alumno
WHERE (f.cod_curso_alumno = '$cod_curso' AND f.anio = '$anio' AND f.semestre = '$semestre' or cod_curso_alumno IS NULL or anio IS NULL or semestre IS NULL) and tr.tipo = '1'
GROUP BY p.id_pregunta, tr.tipo";
$result = mysqli_query($mysqli,$sql);
?>
[<?php while ($registros = mysqli_fetch_array($result)){ ?><?php echo $registros["cantidad_respuestas"] ?>,
<?php }?>]
}, {
name: 'muy en desacuerdo',
data: <?php
$sql = "FROM preguntas p
LEFT JOIN tipo_respuesta tr on p.id_pregunta = tr.id_pregunta
LEFT JOIN respuesta r on tr.id_tipo = r.id_tipo
LEFT JOIN form_alumnos f on r.id_form_alumno_fk = f.id_form_alumno
WHERE (f.cod_curso_alumno = '$cod_curso' AND f.anio = '$anio' AND f.semestre = '$semestre' or cod_curso_alumno IS NULL or anio IS NULL or semestre IS NULL) and tr.tipo = '2'
GROUP BY p.id_pregunta, tr.tipo";
$result = mysqli_query($mysqli,$sql);
?>
[<?php while ($registros = mysqli_fetch_array($result)){ ?><?php echo $registros["cantidad_respuestas"] ?>,
<?php }?>]
}, {
name: 'en desacuerdo',
data: <?php
$sql = "FROM preguntas p
LEFT JOIN tipo_respuesta tr on p.id_pregunta = tr.id_pregunta
LEFT JOIN respuesta r on tr.id_tipo = r.id_tipo
LEFT JOIN form_alumnos f on r.id_form_alumno_fk = f.id_form_alumno
WHERE (f.cod_curso_alumno = '$cod_curso' AND f.anio = '$anio' AND f.semestre = '$semestre' or cod_curso_alumno IS NULL or anio IS NULL or semestre IS NULL) and tr.tipo = '3'
GROUP BY p.id_pregunta, tr.tipo";
$result = mysqli_query($mysqli,$sql);
?>
[<?php while ($registros = mysqli_fetch_array($result)){ ?><?php echo $registros["cantidad_respuestas"] ?>,
<?php }?>]
}, {
name: 'en acuerdo',
data: <?php
$sql = "FROM preguntas p
LEFT JOIN tipo_respuesta tr on p.id_pregunta = tr.id_pregunta
LEFT JOIN respuesta r on tr.id_tipo = r.id_tipo
LEFT JOIN form_alumnos f on r.id_form_alumno_fk = f.id_form_alumno
WHERE (f.cod_curso_alumno = '$cod_curso' AND f.anio = '$anio' AND f.semestre = '$semestre' or cod_curso_alumno IS NULL or anio IS NULL or semestre IS NULL) and tr.tipo = '4'
GROUP BY p.id_pregunta, tr.tipo";
$result = mysqli_query($mysqli,$sql);
?>
[<?php while ($registros = mysqli_fetch_array($result)){ ?><?php echo $registros["cantidad_respuestas"] ?>,
<?php }?>]
}, {
name: 'muy de acuerdo',
data: <?php
$sql = "FROM preguntas p
LEFT JOIN tipo_respuesta tr on p.id_pregunta = tr.id_pregunta
LEFT JOIN respuesta r on tr.id_tipo = r.id_tipo
LEFT JOIN form_alumnos f on r.id_form_alumno_fk = f.id_form_alumno
WHERE (f.cod_curso_alumno = '$cod_curso' AND f.anio = '$anio' AND f.semestre = '$semestre' or cod_curso_alumno IS NULL or anio IS NULL or semestre IS NULL) and tr.tipo = '5'
GROUP BY p.id_pregunta, tr.tipo";
$result = mysqli_query($mysqli,$sql);
?>
[<?php while ($registros = mysqli_fetch_array($result)){ ?><?php echo $registros["cantidad_respuestas"] ?>,
<?php }?>]
}]
});
</script><?php
require_once('../conexion.php');
mysqli_query($mysqli,"SET NAMES 'utf8'");
$cod_curso = $_POST['cod_curso'];
$anio = $_POST['anio'];
$semestre = $_POST['semestre'];
?>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="../Highcharts-6.0.2/code/highcharts.js"></script>
<script src="../Highcharts-6.0.2/code/themes/grid-light.js"></script>
<script src="../Highcharts-6.0.2/code/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
</head>
<body style="margin: 0">
<div id="container" style="width: 100%; height: 600px; margin: 0"></div>
</body>
</html>My problem when passing the variable to the php, I do not understand very well how to apply it in the graph and that every time it is filtered by a course change the data of the graph.
Any guidance or help will be well received.