[LatinaLUG] jquey e ajax

Mer 10 Feb 2016 13:35:57 CET

ciao a tutti,
è      la prima volta  che affronto un problema del genere e ho poca 
familiarità con jquery e ajax.Non vi invio tutto il codice che,oltre  ad 
essere diviso  in file,è anche piuttosto lungo e,in poche 
parole,funziona  cosi':
Ho 4 select con id da 0 a 3. Quando l'utente cambia il valore della 
select 0,vengono impostati alcuni parametri per operare sulla select 1 e 
con questi si esegue una richiesta AJAX con il metodo GET che popola la 
select con id 1.
Stesso discorso quando cambia l'opzione nella select 2;ovviamente,in 
questo caso,viene popolata la select 3 La mia impressione è che non 
chiami lo script. Questa è la pagina iniziale:
-------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery e ajax</title>
<script src="jquery-1.8-0.min.js" language="javascript" 
type="text/javascript"></script>
<script language="javascript" type="text/javascript">

$(document).ready(function() {

     // verifico  quale select ha cambiato  valore e setto,di 
conseguenza,la select da aggiornare
     $('select').each(function(){
         $(this).change(function() {
              var list_select_id=$(this).attr('id');    // ID select che 
ha cambiato valore
              var selectvalue = $(this).val(); // valore selezionato
              var par; // parametri
              var initial_target_html; // prima opzione
              switch (list_select_id)
              {
                  case 0:
                     list_target_id='#1';
                     initial_target_html = '<option value="0">Seleziona 
una categoria</option>';
                     par='id_cat='+seletvalue;
                     break;
                 case 2:
                     list_target_id='#3';
                     initial_target_html = "<option value='0'>Seleziona 
un'area/option>";
                     par='id_area' + seletvalue;
                     break;
              }

  alert(list_target+" - "+par);
              $(list_target_id).html(initial_target_html); // inserisce 
la prima opzione nel secondoo menù

              $('#'+list_select_id).change(function(e) {
                  // visuualizza un messagio in attesa di caricaree u  dati
                  $(list_target_id).html('<option value="0">Sto 
caricando</option>');
                  //if-else
                  if (selectvalue == "") {
                      // Se non è selezionata um'opzione nel primo 
menù,neò secondo viene visualizzata la prima opzione
                      $(list_target_id).html(initial_target_html);
                  } else {
                      // richiest AJAX con GET
                      $.ajax({url: 'ajax-scat.php?'+ par,
                          success: function(output) {
                              // visualizza le opzioni in caso di successo
                              $(list_target_id).html(output);
                          },
                          error: function (xhr, ajaxOptions, thrownError) {
                              // visualizza eventuali errori
                              alert(xhr.status + " "+ thrownError);
                          }
                      }); // chiudo $.ajax
                  } //if-else
              }); // chiudo $(list_select_id).change(

         });// chiudo $(this).change(
     });// chiudo $('select').each(

}); //chiudo ready

</script>
</head>
<body>
<div style='position:absolute; top:150px; left:100px; width:900px; 
height:200px'>
<?php
   include ("config_db.php");  // funzioni per la connessione al db
   include ("php_html.php");   // scrive codice html tramite php
   $db=connect();
   $m_cat=crea_menu($db,"categorie","cat","index.php",0,0,"cat");
   $m_area=crea_menu($db,"area","area","index.php",0,2,"area");
   mysql_close($db);
   $m_scat=crea_menu_nill(1,"scat");
   $m_uff=crea_menu_nill(3,"uff");
   $s="<form  name='ins' method='post' action=''>";
   $s.="<table width='100%'>";
   $s.="<tr height=50>";
   $s.=ins_menu("Categoria :","5%",1,$m_cat,"30%",1,"top","","","",0);
   $s.=ins_menu("Sottocategoria :","5%",1,$m_scat,"30%",1,"top","","","",0);
   $s.="</tr>";
   $s.="<tr height=50>";
   $s.=ins_menu("Area :","5%",1,$m_area,"30%",1,"top","","","",0);
   $s.=ins_menu("Ufficio :","5%",1,$m_uff,"30%",1,"top","","","",0);

   $s.="</tr></table>";

   $s.=ins_submit();
   $s.="</form>";
   echo $s;

?>
</div>
</body>
</html>
----------------------------------------------
dove  sbaglio?
Ciao e grazie