Oui, vous devez utiliser ajax ici. Vérifiez le code et les notes suivants.
Écrivez la fonction qui retourne un ActiveXObject()
qui ferait un appel ajax comme
function getXMLHTTP() {
var xmlhttp = false;
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e1) {
xmlhttp = false;
}
}
}
}
return xmlhttp;
}
Ensuite, écrivez une fonction spécifique à votre site qui obtiendrait les données souhaitées comme
function getProducts(){
var select1 = document.getElementById("cboCategory");
var strURL = "getproducts.php?city="+select1.options[select1.selectedIndex].value;
var req = getXMLHTTP(); // function to get xmlhttp object
if (req) {
req.onreadystatechange = function() {
if (req.readyState == 4) { // data is retrieved from server
if (req.status == 200) { // which reprents ok status
document.getElementById('productsdiv').innerHTML = req.responseText; // div to be updated
} else {
alert("[GET Products]There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
};
req.open("GET", strURL, true); // open url using get method
req.send(null);
}
}
Cette fonction serait appelée lors d'un événement de changement de la cboCategory
sélectionnez les options, de sorte que le code HTML correspondant serait
<select onchange="getProducts()" id="cboCategory" class="box">
...
</select>
<!-- Can be anywhere on same page -->
<div id="productdiv"> </div>
Votre page getproduct.php renverrait un html en tant que chaîne qui écraserait le contenu de producstdiv
tag dans votre page html.
Vous pouvez également renvoyer des données de php en tant que json . Consultez son wiki de balises pour plus d'informations. Vous pouvez également utiliser jquery pour faire un appel ajax.