Visualizzazione dei risultati da 1 a 3 su 3

Discussione: select dinamica

  1. #1
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    11

    select dinamica

    Ciao a tutti, ho un piccolo problema con javascript e php che non mi lascia dormire e spero voi possiate aiutarmi.
    Allora, sto cercando di costruire delle select che si auto aggiornano in seguito alla precedente select. Il tutto prende i dati da UNA sola tabella MySQL.
    Ho trovato il seguente script sul web ma non riesco ad adattarlo in modo che la terza select si aggiorni in funzione delle DUE precedenti e non solo della precedente.
    Spero possiate aiutarmi e vi ringrazio già in anticipo.

    index.php:
    codice:
    <?php 
      include('db.php');
      include('func.php');
    ?>
    
    <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
    </script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('#wait_1').hide();
        $('#drop_1').change(function(){
          $('#wait_1').show();
          $('#result_1').hide();
          $.get("func.php", {
            func: "drop_1",
            drop_var: $('#drop_1').val()
          }, function(response){
            $('#result_1').fadeOut();
            setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
          });
            return false;
        });
    });
    
    function finishAjax(id, response) {
      $('#wait_1').hide();
      $('#'+id).html(unescape(response));
      $('#'+id).fadeIn();
    }
    function finishAjax_tier_three(id, response) {
      $('#wait_2').hide();
      $('#'+id).html(unescape(response));
      $('#'+id).fadeIn();
    }
    </script>
    
    </head>
    
    <body>
    
    <form action="" name="form" method="post">
        <select name="drop_1" id="drop_1">
             <option value="" selected="selected" disabled="disabled">Select a Category</option>
             <?php getTierOne(); ?>   
        </select><br>
        
        <span id="wait_1" style="display: none;">
        <img alt="Please Wait" src="ajax-loader.gif"/>
        </span>
        <span id="result_1" style="display: none;"></span><br>
        <span id="wait_2" style="display: none;">
        <img alt="Please Wait" src="ajax-loader.gif"/>
        </span>
        <span id="result_2" style="display: none;"></span><br>
      
    </form>
    </body>

    func.php:

    codice:
    <?php
    //*******Page load dropdown results
    function getTierOne()
    {
        $result = mysql_query("SELECT DISTINCT tier_one FROM three_drops") 
        or die(mysql_error());
    
          while($tier = mysql_fetch_array( $result ))   
            {
               echo '<option value="'.$tier['tier_one'].'">'.$tier['tier_one'].'</option>';
            }
    }
    
    //******First selection results
    if($_GET['func'] == "drop_1" && isset($_GET['func'])) { 
       drop_1($_GET['drop_var']); 
    }
    
    function drop_1($drop_var)
    {  
        include_once('db.php');
        $result = mysql_query("SELECT DISTINCT tier_two FROM three_drops WHERE tier_one='$drop_var'") 
        or die(mysql_error());
        
        echo '<select name="drop_2" id="drop_2">
              <option value=" " disabled="disabled" selected="selected">Choose one</option>';
               while($drop_2 = mysql_fetch_array( $result )) 
                {
                  echo '<option value="'.$drop_2['tier_two'].'">'.$drop_2['tier_two'].'</option>';
                }    
        echo '</select>';
        echo "<script type=\"text/javascript\">
    $('#wait_2').hide();
        $('#drop_2').change(function(){
          $('#wait_2').show();
          $('#result_2').hide();
          $.get(\"func.php\", {
            func: \"drop_2\",
            drop_var: $('#drop_2').val()
          }, function(response){
            $('#result_2').fadeOut();
            setTimeout(\"finishAjax_tier_three('result_2', '\"+escape(response)+\"')\", 400);
          });
            return false;
        });
    </script>";
    }
    
    //******Second selection results
    if($_GET['func'] == "drop_2" && isset($_GET['func'])) { 
       drop_2($_GET['drop_var']); 
    }
    
    function drop_2($drop_var)
    {  
        include_once('db.php');
        $result = mysql_query("SELECT * FROM three_drops WHERE tier_two='$drop_var'") 
        or die(mysql_error());    
        echo '<select name="drop_3" id="drop_3">
              <option value=" " disabled="disabled" selected="selected">Choose one</option>';
               while($drop_3 = mysql_fetch_array( $result )) 
                {
                  echo '<option value="'.$drop_3['tier_three'].'">'.$drop_3['tier_three'].'</option>';
                }   
        echo '</select><br>';
        echo '<input type="submit" name="submit" value="Submit" />';
    }
    ?>


    Potete vedere lo script applicato qui:
    http://provaexamnet.altervista.org/vvv/index.php
    Ultima modifica di Pablo11; 17-03-2014 a 17:36

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    A) A parte il cross-post vistato (regolamento questo sconosciuto) quando bastava aggiornare la precedente discussione
    B) Quotare il post del forum di giorgiotave (è di cattivo gusto)
    C) la pagina demo provata con safari 7 e firefox 27 funziona benissimo

    Ultima modifica di cavicchiandrea; 17-03-2014 a 18:24
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it L'avatar di Xinod
    Registrato dal
    Sep 2000
    Messaggi
    13,649
    continua dove hai cominciato

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.