Her er en meget enkel procedure. Jeg vil bare vise hovedskelettet. Tilføjelse af flash-kød vil være fra din side.
Antag, at vi har to <select>
i ajax.php
sådan her:
<select id="parent">
<option value="1">value1</option>
<option value="2">value2</option>
<option value="3">value3</option>
<option value="4">value4</option>
</select>
<select id="child">
</select>
Så hvad har vi brug for? Vi skal udfylde den anden <select>
på event af dets valg.
Her kommer javascript-delen (ajax.php)
<script type="text/javascript">
$(function(){
$('#parent').change(function(){ //on change event
var parentVal = $('#parent').val(); //<----- get the value from the parent select
$.ajax({
url : 'process.php', //the url you are sending datas to which will again send the result
type : 'GET', //type of request, GET or POST
data : { parentValue: parentVal}, //Data you are sending
success : function(data){$('#child').html(data)}, // On success, it will populate the 2nd select
error : function(){alert('an error has occured')} //error message
})
})
})
</script>
Dette vil sende anmodningen til process.php
Nu kommer process.php
Her har vi brug for dataene til at udfylde den 2. <select>
Hvad skal der nu inde i <select>
?
<option value="someValue">someText</option>
Du skal udskrive noget som dette:
<option value="11">value11</option>
<option value="12">value12</option>
<option value="13">value13</option>
<option value="14">value14</option>
Værdi og teksten indeni fylder med dine behov.
Som det vil komme fra databasen:
- Du kan få den overordnede valgværdi i
process.php
med$_GET['parentValue']
- Med denne værdi skal du forespørge i databasen
- Så fra resultatet returneret fra databasen, brug en løkke
while
,foreach
ellerfor
(afhængigt af måden du henter det på), lav<option value="someValue">someText</option>
. - du er færdig!
Til multivalg
for at gøre livet en smule lettere, kan du bruge chosen multiselect
Et råd
mysql_*
er forældet. brug PDO i stedet. Her er et link til et tutorial