Witam.
Chcę zrobić coś takiego jak konfigurator monitorów LCD. Ma to działać tak, że wybiera się podstawowe parametry monitora jak wielkość i rodzaj matrycy, rodzaj podstawy itp. Chcę to zrobić bez przeładowania strony. No i mam stworzone odpowiednie selecty które przybierają odpowiednie wartości pobrane z bazy danych. Do tego miejsca nie było problemów. Następnie chciałem zrobić coś takiego, że po wyborze z pierwszego selecta rozmiaru matrycy np. 17" w divie pokazują się wszystkie monitory 17", po wyborze rodzaju matrycy chciałem zrobić tak, że z listy już wyświetlonej znikną modele, które mają inny typ matrycy niż ten wybrany a tymczasem kasuje mi się lista z monitorami 17" a na jej miejsce wskakują monitory z wybranym typem matrycy.
Całość skryptu jest rozbita na następujące pliki:
index.php
<html>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<body>
<script type="text/javascript">
function strona(plik) {
var xml = null;
var wynik = document.getElementById("wynik");
wynik.innerHTML = "Trwa ładowanie strony";
if (window.XMLHttpRequest) xml = new XMLHttpRequest();
else if (window.ActiveXObject) xml = new ActiveXObject("Microsoft.XMLHTTP");
if (xml) {
xml.onreadystatechange = function() {
if (xml.readyState==4) {
wynik.innerHTML = xml.responseText;
}
}
xml.open("GET", plik+".htm", true);
xml.send(null);
}
return false;
}
</script>
<script src="select.js"></script>
<form>
<table border="1" width="800px">
<tr><td width="200">Wielkość matrycy :</td>
<td><select id="wielkosc" name="wielkosc" onchange="select(this.value)">
<option>wybierz</option>
<?php
include('connect.php');
$query = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 1 ORDER BY parametr ASC;"); $i = 1;
$wielkosc = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('s$i')\">$wielkosc</option>"; $i++;
}
?>
</select></td>
<td rowspan="6" width="200"> <div id="wynik"></div></td>
</tr>
<tr><td width="200">Rodzaj matrycy :</td>
<td><select name="rodzaj" onchange="select(this.value)">
<option>wybierz</option>
<?php
$query1 = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 2 ORDER BY parametr ASC;"); $i = 1;
$rodzaj_matrycy = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('r$i')\">$rodzaj_matrycy</option>"; $i++;
}
?>
</select></td>
</tr>
<tr><td width="200">Rozdzielczość :</td>
<td><select name="rozdzielczosc" onchange="select(this.value)">
<option>wybierz</option>
<?php
$query2 = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 3 ORDER BY parametr ASC;"); $i = 1;
$rozdzielczosc = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('p$i')\">$rozdzielczosc</option>"; $i++;
}
?>
</select></td>
</tr>
<tr><td width="200">Rodzaj podstawy :</td>
<td><select name="podstawa" onchange="select(this.value)">
<option>wybierz</option>
<?php
$query3 = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 38 ORDER BY parametr ASC;"); $i = 1;
$podstawa = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('o$i')\">$podstawa</option>"; $i++;
}
?>
</select></td>
</tr>
<tr><td width="200">Wejścia sygnałowe :</td>
<td><select name="wejscia" onchange="select(this.value)">
<option>wybierz</option>
<?php
$query4 = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 18 ORDER BY parametr ASC;"); $i = 1;
$wejscia = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('n$i')\">$wejscia</option>"; $i++;
}
?>
</select></td>
</tr>
<tr><td width="200">Kolor obudowy :</td>
<td><select name="kolor" onchange="select(this.value)">
<option>wybierz</option>
<?php
$query5 = mysql_query("SELECT DISTINCT id_parametru, parametr FROM parametry WHERE id_kategorii = 30 ORDER BY parametr ASC;"); $i = 1;
$kolor = $wynik['parametr'];
$id = $wynik['id_parametru'];
echo "\n\t\t\t<option value=$id onclick=\"return strona('m$i')\">$kolor</option>"; $i++;
}
?>
</select></td>
</tr>
</table>
</form>
<p>
<div id="txtHint"><b></b></div>
</p>
</body>
</html>
select.js
<?php
var xmlHttp;
function select(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Problem przegladarki");
return;
}
var url="get.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
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;
}
?>
get.php
<?php
$q=$_GET["q"];
//$q= 2;
require_once('connect.php');
$query = mysql_query("SELECT nazwa FROM monitor, parametry, parametry_monitora WHERE monitor.id_monitora = parametry_monitora.id_monitora AND parametry_monitora.id_parametru = parametry.id_parametru AND parametry.id_parametru = '".$q."' ORDER BY nazwa ASC");
{
echo $row['nazwa']."<br>"; }
} else echo "Nie ma monitorow spelniajacych Twoje kryteria. Please try again ;-)"; ?>
Ktoś pomoże ?
Ten post edytował slawek3422 11.03.2009, 13:26:26