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