Organizare mai multe select-uri cu ajax
Scris: Vin Noi 18, 2016
De cateva zile ma chinui la o modalitatea de organizare a codului. Vreau sa fac urmatorul lucru: am doua selecturi si doua grafice dinamice in functie de valorile selectate din selecturi. Am incercat diferite variante urmarind si citind tutoriale pe google dar tot in ceata sunt.
PRIMUL GRAFIC:
Valorile din form sunt preluate cu ajax:
fisierul php care aduce valorile din BD:
AL DOILEA GRAFIC
valorile din al doilea grafic depind si de selectiile din primul form
Valorile din form sunt preluate cu ajax:
fisierul php care aduce valorile din BD, seamana foarte mult cu primul, difera doar sql-ul
Ce nelamuriri am:
- <form> mai este necesar in cazul meu daca am selecturi, sau este necesar numai cand am inputuri?
- graficele vor creste si nu vreau sa fac cate un fisier pentru fiecare grafic cu functiile ajax si fisiere separat pentru codurile sql.
In momentul de fata am:
- index.php - contin selecturile si graficele
- grafic_1.js - cod ajax si cod grafic
- grafic_2.js - cod ajax si cod grafic
- grafic_1.php - preluarea datelor din BD si inserarea lor in primul grafic
- grafic_2.php - preluarea datelor din BD si inserarea lor in al doilea grafic
Vreau sa limitez numarul de fisiere la:
- index.php
- ajax_grafice.js
- get_bd_grafice.php
Cum pot face acest lucru?
Multumesc!
PRIMUL GRAFIC:
Cod: Selectaţi tot
<form>
<select id="frm_nume_chest" onchange="fetch_select();">
<option value="1"> test 1</option>
<option value="2"> test 2</option>
</select>
</form>
<div id="higtchart_medie_gen" style="min-width:300px; height:400px; margin:0 auto"></div>
Cod: Selectaţi tot
function fetch_select(){
val_frm_nume_chest = $('#frm_nume_chest').val();
$.ajax({
type: 'POST',
url: 'include/get_db.inc.php',
data: {
frm_nume_chest: val_frm_nume_chest
},
success: function (response) {
document.getElementById('higtchart_medie_gen').innerHTML=response;
columnChart( JSON.parse(response));
}
});
}
function columnChart(data_v){
....
Cod: Selectaţi tot
$ret =[]; //Array-ul cu datele care vor fi returnate, in format json
$frm_nume_chest = $_POST['frm_nume_chest'];
$sql = "SELECT ....
ORDER BY MEDIE DESC";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$ret [] = [$row['NUME'] . ' ' . $row['PRENUME'], floatval($row['MEDIE'])];
}
if (count($ret) >1){
echo json_encode($ret);
}
else {
echo 'Nu sunt valori pentru userul selectat';
}
}
valorile din al doilea grafic depind si de selectiile din primul form
Cod: Selectaţi tot
<form>
<select id="frm_intrebare" onchange="fetch_select_2();">
<option value="1"> intr 1</option>
<option value="2"> intr 2</option>
</select>
</form>
<div id="higtchart_medie_gen" style="min-width:300px; height:400px; margin:0 auto"></div>
Cod: Selectaţi tot
function fetch_select_2(){
val_frm_nume_chest = $('#frm_nume_chest').val();
val_frm_intrebare = $('#frm_intrebare').val();
$.ajax({
type: 'POST',
url: 'include/get_media_intrebare.inc.php',
data: {
frm_nume_chest: val_frm_nume_chest,
frm_intrebare: val_frm_intrebare,
},
success: function (response) {
document.getElementById('higtchart_medie_intrebare').innerHTML=response;
columnChart2( JSON.parse(response));
}
});
}
function columnChart2(data_v){
....
Cod: Selectaţi tot
$ret =[]; //Array-ul cu datele care vor fi returnate, in format json
$frm_nume_chest = $_POST['frm_nume_chest'];
$sql = "SELECT ....
ORDER BY MEDIE DESC";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$ret [] = [$row['NUME'] . ' ' . $row['PRENUME'], floatval($row['MEDIE'])];
}
if (count($ret) >1){
echo json_encode($ret);
}
else {
echo 'Nu sunt valori pentru userul selectat';
}
}
- <form> mai este necesar in cazul meu daca am selecturi, sau este necesar numai cand am inputuri?
- graficele vor creste si nu vreau sa fac cate un fisier pentru fiecare grafic cu functiile ajax si fisiere separat pentru codurile sql.
In momentul de fata am:
- index.php - contin selecturile si graficele
- grafic_1.js - cod ajax si cod grafic
- grafic_2.js - cod ajax si cod grafic
- grafic_1.php - preluarea datelor din BD si inserarea lor in primul grafic
- grafic_2.php - preluarea datelor din BD si inserarea lor in al doilea grafic
Vreau sa limitez numarul de fisiere la:
- index.php
- ajax_grafice.js
- get_bd_grafice.php
Cum pot face acest lucru?
Multumesc!