ecco una possibile soluzione
codice:
<html>
<head>
<script>
var path_runtime1 = "";
var path_runtime2 = "";
var file_ext = "html"; // estensione del file
var path_orig = location.href;
path_orig = path_orig.replace(/^(.*\/)(.+)$/, function($0, $1) { return $1 } );
var bmw = new Array(
"Serie 523",
"Serie 525",
"Serie One"
)
var toyota = new Array(
"Corolla",
"RAV 4",
"Yaris"
)
function byid(id) {
return document.getElementById(id);
}
function Cat1ToCat2(val) {
var nodes = byid('cat2').options.length;
while (nodes > 0) {
byid('cat2').removeChild(byid('cat2').options[0]);
nodes = byid('cat2').options.length;
}
if (val != "") {
path_runtime1 = path_orig + val.replace(/\s/g, '');
arr = eval(val);
var c_select = byid('cat2');
var c_option = document.createElement('option');
c_option.setAttribute("value", "");
c_option.innerHTML = "Seleziona";
c_select.appendChild(c_option);
for (i=0; i<arr.length; i++) {
var c_option = document.createElement('option');
c_option.setAttribute("value", arr[i]);
c_option.innerHTML = arr[i];
c_select.appendChild(c_option);
}
byid('cat2').removeAttribute('disabled');
}
else {
path_runtime1 = "";
byid('cat2').selectedIndex = 0;
byid('cat2').setAttribute("disabled", "disabled");
}
}
function goPage(val) {
if (val != "") {
path_runtime2 = path_runtime1 + "/" + val.replace(/\s/g, '') + "." + file_ext;
location.href = path_runtime2;
}
else {
path_runtime2 = path_runtime1;
}
}
</script>
</head>
<body>
<select name="cat1" id="cat1" onchange="Cat1ToCat2(this.value)">
<option value="">Seleziona</option>
<option value="bmw">BMW</option>
<option value="toyota">Toyota</option>
</select>
<select name="cat2" id="cat2" disabled="disabled" onchange="goPage(this.value)"></select>
</body>
</html>
ne spiego il funzionamento:
- gli array devono chiamarsi esattamente come gli attributi value della prima select (nell'esempio bmw, toyota). Le 2 option che hanno testo "seleziona" devono contenere un valore nullo;
- la seconda select aggiunge in automatico la prima opzione (infatti gli array contengono solo le opzioni non vuote, mentre poi appare anche "seleziona" come prima option);
- se tu salvi lo script ad es nella pagina www.tuosito.it/script.html e selezioni la "serie 525" nella categoria bmw la pagina sarà reindirizzata in www.tuosito.it/bmw/serie525.html (nota che lo spazio bianco tra "serie" e "525" viene eliminato).
Puoi eventualmente cambiare l'estensione di default (variabile file_ext).
Ciao
Rispondi quotando
