Evo pokushacu da ti objasnim shto jednostavnije... To se inache radi preko AJAX-a...
Za pochetak, ono shto treba da uradish u HTML-u kodu, odnosno u output delu tog tvog projekta je da na taj prvi drop down dodash dogadjaj
onchange, npr. ovako:
Code:
<select name = "lista1" onchange = "izbor(this.value);">
Takodje, tom drugom drop down-u dodaj neki id, npr.
id = "lista2".
Namerno sam u pozivu te f-je stavio
this.value, chisto kao "prechica", da ne bi u kodu za AJAX morao da dohvatam vrednost te liste. A na osnovu te izabrane vrednosti (koja je recimo id neke tabele iz baze) ce se ispisivati sadrzaj te druge liste.
Kod fajla sa AJAX-om bi izgledao recimo ovako:
Code:
var xmlHttp;
function izbor(id) {
xmlHttp = GetXmlHttpObject();
if (xmlHttp == null) {
alert ("Vaš browser ne podržava AJAX.");
return;
}
/**
* Definisanje php skripta koji ce da prihvati zahtev.
* Ova putanja mozhe da varira u zavisnosti od toga gde si postavila taj php fajl u odnosu na stranu na kojoj cesh da uchitavash ovaj AJAX fajl.
*/
var url = "izbor_handler.php";
xmlHttp.onreadystatechange = promena; //definisanje dogadjaja po slanju zahteva
//slanje zahteva POST metodom
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
xmlHttp.send("item_id=" +id); //id je inache argument ove funkcije, a item_id je promenljiva koja ce se nalaziti u $_POST['id'] u tom php skriptu koji prihvata zahtev
}
//ovo je funkcija koja se poziva na dogadj onreadystatechange i ona treba da odradi promenu na drugoj listi
function promena() {
if (xmlHttp.readyState == 4) { //kada je zahtev kompletiran (ovde cesh uvek pisati "shta zhelish da se odradi" po izvrshenju zahteva)
document.getElementById('lista2').innerHTML = xmlHttp.responseText; //ispisivanje onoga shto je ispisao php skript unutar onoga shto obuhvata element sa id-em 'lista2'
}
}
//ovo je funckcija za kreiranje XmlHttp objekta, ona se uvek zapisuje tako, i tu nema shta da menjash...
function GetXmlHttpObject(){
var xmlHttp = null;
try {
// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
Ceo ovaj fajl sa AJAX-om treba da sachuvash sa nekim imenom, npr. izbor.js, i da ga uchitash u head sekciju tvoje web strane -
<script language = "JavaScript" src = "izbor.js"></script>. Naravno, ta putanja mozhe da varira u zavisnosti od toga gde si postavila taj AJAX fajl u odnosu na stranu na kojoj ga uchitavash...
A kod php skripta
izbor_handler.php bi izgledao ovako nekako:
Code:
<?php
$item_id = $_POST['item_id'];
/*
ovde ide tvoj kod za dohvatanje podataka iz baze
npr. $upit = "SELECT nekoPolje FROM tabela WHERE item_id = $item_id",
itd.
...
*/
/*
zatim treba u petlji da ispishesh rezultat tog upita, ali u obliku <option>vrednost</option>,
jer ono shto ispishe ovaj skript ce se ispisati unutar tog drugog select-a, npr.
while($red = mysql_fetch_assoc($rezultat)) {
echo '<option>' .$red['nekoPolje'] . '</option>';
}
*/
?>
Eto, sve sam ti opisao u tim komentarima u kodu, nadam se da nisam previshe zakomplikovao... :) To ti je neka osnova AJAX-a, i taj princip cesh uvek da koristish...
Dinamicni formular
