Creazione 2° select in base alla scelta effettuata sulla 1° select

**ferr** · 12-12-2014, 13:47

Buongiorno a tutti! ho un problema a compilare la seconda select in base alla scelta effettuata sulla prima select.
Io non conosco per niente javascript perciò provo a chiedere a voi.

Codice PHP:


/* 1° SELECT */

<select id="esame" name="esame" onChange="check(this.value)">
      <option value="" selected="selected">---Seleziona un esame---</option>
      <?php
             $q = "SELECT id, fullname, shortname FROM course;";            
             $result = mysql_query($q, $con);        
             while($row=mysql_fetch_array($result))        
             {    ?>
                  <option value=<?php echo $row['id']; ?>><?php echo $row['fullname']; ?></option>    
     <?php        
             }    ?>
</select>

In pratica questa select mi elenca una serie di esami. In base all'esame scelto voglio un ulteriore scelta che mi elenca le lezioni di quell'esame; quindi dovrò effettuare una query in base all'id (value) del corso scelto

Codice PHP:


/* 2° SELECT */

<select id="videolezioni" name="videolezioni" disabled="">     
     <option value="" selected="selected">---Seleziona una videolezione---</option>    
     <?php        
          $q = "SELECT id, name FROM url WHERE course=$idcorso;";    // dove $idcorso deve essere il value della prima select        
          $result = mysql_query($q, $con);       
          while($row=mysql_fetch_array($result))        
         {        ?>                        
                <option value=<?php echo $row['id']; ?>><?php echo $row['name']; ?></option>     
  <?php        
          }    ?>  
</select>

Come posso fare ciò?

Navigando su internet sono riuscita a fare questo misero script:

Codice PHP:


function check(val)
{    
       document.getElementById('videolezioni').disabled = false;
}

E' possibile passare la variabile 'val' (che contiene il value, quindi l'id del corso) alla seconda select in modo che poi mi esegua correttamente la query?

Altrimenti che metodo mi consigliate?

Ringrazio tutti in anticipo.

**lucavizzi** · 13-12-2014, 16:10

Ciao ferr,
Devi usare Ajax per popolare la seconda select:

codice:

<head>
<!--Libreria jQuery-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
 $('#esame').change(function(){//quando la select#esame cambia:
  var idEsame=$(this).val();//recuperiamo l'id dell'esame
  $.ajax({//lo passiamo alla pagina "videolezioni.php" che ci restituirà le videolezioni
   type: "GET",
   url: "videolezioni.php",
   data: 'idEsame='+idEsame,
   cache: false,
   success: function(response){//ad operazione completata
    $('#videolezioni').html(response);//popoliamo la select delle videolezioni
   }
  });
 });
});
</script>

</head>
<body>
<select id="esame" name="esame">
      <option value="" selected="selected">---Seleziona un esame---</option>
      <?php
             $q = "SELECT id, fullname, shortname FROM course;";            
             $result = mysql_query($q, $con);        
             while($row=mysql_fetch_array($result))        
             {    ?>
                  <option value=<?php echo $row['id']; ?>><?php echo $row['fullname']; ?></option>    
     <?php        
             }    ?>
</select>

<!--Questa select verrà popolata quando avremo un id-esame, inizialmente sarà vuota-->
<select id="videolezioni" name="videolezioni">
     <option value="">---Seleziona un esame &uarr;---</option> 
</select>
</body>

File videolezioni.php

Codice PHP:


<?php
//connessione al db
   
          $q = "SELECT id, name FROM url WHERE course=".$_GET['idEsame']
          $result = mysql_query($q, $con);       
          while($row=mysql_fetch_array($result))        
         {        ?>                        
                <option value=<?php echo $row['id']; ?>><?php echo $row['name']; ?></option>     
  <?php        
          }    
//nota: è importante che questo file stampi a video solo le option per la select#videolezioni, non deve contenere altri tag HTML
?>

Ho commentato il codice, fammi sapere se hai bisogno di chiarimenti

**ferr** · 14-12-2014, 12:12

Ti ringrazio davvero tanto, sei stato molto chiaro .... il problema è che però non mi funziona

Mi da questo errore "Failed to load resource: the server responded with a status of 500 (Internal Server Error)" quando uso la chiamata Ajax....
Come risolvo questo problema?

**cavicchiandrea** · 14-12-2014, 12:41

E' un errore server la chiamata ajax è ininfluente verifica la pagina videlezioni.php connessione, nome-tabella, campi, etc...

**lucavizzi** · 14-12-2014, 14:15

Originariamente inviata da ferr

Ti ringrazio davvero tanto, sei stato molto chiaro .... il problema è che però non mi funziona

Mi da questo errore "Failed to load resource: the server responded with a status of 500 (Internal Server Error)" quando uso la chiamata Ajax....
Come risolvo questo problema?

controlla la parte in php

**ferr** · 14-12-2014, 14:34

codice HTML:

<head>

<!--Libreria jQuery-->    
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script type="text/javascript">        
   $(function(){            
         $("select#videolezioni").attr("disabled","disabled");    // disabilito la select videolezioni finche non viene scelto l'esame             
         $('select#esame').change(function(){    // quando la select#esame cambia:                            
               $("select#videolezioni").removeAttr("disabled");    // abilito la select videolezioni                  
               var idEsame=$(this).val();    // recuperiamo l'id dell'esame                  
               $.ajax({    // lo passiamo alla pagina "videolezioni.php" che ci restituirà le videolezioni                    
                    type: "GET",                    
                    url: "videolezioni.php",                    
                    data: 'idEsame='+idEsame,   // variabile idEsame che gli passo in get                    
                    cache: false,                    
                    success: function(response){    // ad operazione completata             
                           $('select#videolezioni').html(response);    // popoliamo la select delle videolezioni                       
                    }                  
                });             
          });        
});
</script>


<select id="esame" name="esame">        
      <option value="" selected="selected">---Seleziona un esame---</option> 
      <?php        
             $q = "SELECT id, fullname FROM course;";         
             $result = mysql_query($q, $con);        
             while($row=mysql_fetch_array($result))        
             {    ?> 
                  <option value=<?php echo $row['id']; ?>><?php echo $row['fullname']; ?></option> 
      <?php        
             }  ?>
</select>


<!--Questa select verrà popolata quando avremo un idesame, inizialmente sarà vuota-->
<select id="videolezioni" name="videolezioni">     
      <option value="" selected="selected">---Seleziona una videolezione---</option>
</select>

videolezioni.php

Codice PHP:


<?php
    $host = "localhost";
    $user = "root";
    $pass = "XXX";        
    $db = "YYY";    
            
    // Connessione
    $con = mysql_connect($host, $user, $pass) or die("Connessione MySql non riuscita ".mysql_error());    
    mysql_select_db($db, $con) or die("Apertura DB fallita");




    // Query che mi estrae le videolezioni corrispondenti al corso scelto ($_GET['idEsame'])
    $q = "SELECT id, name FROM url WHERE course=".$_GET['idEsame']";    
    $result = mysql_query($q, $con);       
    while($row=mysql_fetch_array($result))        
    {    
        echo '<option value="'.$row['id'].'">'.$row['name'].'</option>';
    }

?>

Non mi sembra di vedere un errore.
Ti ringrazio davvero per la tua disponibilità.

**lucavizzi** · 14-12-2014, 15:27

Nella query ci sono delle doppie virgolette in più:

Codice PHP:


$q = "SELECT id, name FROM url WHERE course=".$_GET['idEsame']";

dovrebbe essere

Codice PHP:


$q = "SELECT id, name FROM url WHERE course=".$_GET['idEsame'];

**ferr** · 14-12-2014, 16:03

grazieeeeeeeeeeee

Ora funziona

Discussione: Creazione 2° select in base alla scelta effettuata sulla 1° select

Strumenti discussione

Ricerca discussione

Visualizza

Creazione 2° select in base alla scelta effettuata sulla 1° select

Tag per questa discussione

Permessi di invio