En php: les valeurs de liste déroulante dépendent d'une autre liste déroulante sous la même forme

Question

Comment puis-je réaliser cette solution? Les valeurs de liste déroulante dépendent d'une autre liste déroulante du même formulaire par exemple. : Une forme contient dropdownlist (car_name), dropdownlist (modèles de cette voiture), bouton (recherche) avis que: 1) Les valeurs CAR_MODEL dépendent de la valeur car_name 2) car_name dropdownlist et CAR_MODEL dropdownlist sous la même forme

merci Cordialement.

Answer 1

<form> 
<select id="car_name"> 
    <option value="car1">Car 1</option> 
    <option value="car2">Car 2</option> 
    <option value="car3">Car 3</option> 
</select> 
<select id="car_model"> 
</select> 
</form> 
<script type="text/javascript"> 
// Maps all available car models 
var modelMap = { 
    'car1': [ 
     // Each entry contains the model's ID and text/label. 
     ['car1-1', 'Car 1.1'], 
     ['car1-2', 'Car 1.2'], 
     ['car1-3', 'Car 1.3'] 
    ], 
    'car2': [ 
     ['car2-1', 'Car 2.1'], 
     ['car2-3', 'Car 2.2'] 
    ], 
    'car3': [ 
     ['car3-1', 'Car 3.1'], 
     ['car3-2', 'Car 3.2'], 
     ['car3-3', 'Car 3.3'], 
     ['car3-4', 'Car 3.4'], 
     ['car3-5', 'Car 3.5'] 
    ] 
}; 

// Get the dropdown list elements. 
var nameList = document.getElementById('car_name'); 
var modelList = document.getElementById('car_model'); 

// Function to be called when the car name is changed 
nameList.onchange = function() { 
    // Get the selected car. 
    var selectedName = nameList.options[nameList.options.selectedIndex].value; 
    // Lookup available models in the map. 
    var availModels = modelMap[selectedName] || []; 

    var i, opt; 

    // Set available models in the model dropdown. 
    for (i = 0; i < availModels.length; ++i) { 
     opt = availModels[i]; 
     modelList.options[i] = new Option(opt[0], opt[1]); 
    } 

    // Remove all old options if the new car has fewer models than a previous selection. 
    for (; i < modelList.options.length; ++i) { 
     modelList.options[i] = null; 
    } 
}; 
</script> 

Answer 2

voiture 1 voiture 2 voiture 3

// carte modèles voiture tous disponibles var modelMap = { 'voiture1': [ // Chaque entrée contient l'ID du modèle et du texte /étiquette. ['car1-1', 'Car 1.1'], ['car1-2', 'Car 1.2'], ['car1-3', 'Car 1.3'], ], 'car2': [ ['car2-1', 'Car 2.1'], ['car2-3', 'Voiture 2.2'] ], 'car3': [ ['car3-1', 'Car 3.1'], ['car3-2', 'Voiture 3.2'], ['car3-3', 'Voiture 3.3'], ['car3-4', 'Voiture 3.4'], ['car3-5', 'Car 3.5'] ]};

// Récupère les éléments de la liste déroulante. var nomList = document.getElementById ('nom_car'); var modelList = document.getElementById ('car_model');

// fonction à appeler lorsque la voiture nom est changé nameList.onchange = function () {// Obtenez la voiture sélectionnée. var selectedName = nameList.options [nomListe.options.selectedIndex] .value; // Rechercher les modèles disponibles dans la carte. var availModels = modelMap [selectedName] || [];

var i, opt; 

// Set available models in the model dropdown. 
for (i = 0; i < availModels.length; ++i) { 
    opt = availModels[i]; 
    modelList.options[i] = new Option(opt[0], opt[1]); 
} 

// Remove all old options if the new car has fewer models than a previous selection. 
for (; i < modelList.options.length; ++i) { 
    modelList.options[i] = null; 
} }; </script> 

Ceci est correct, mais la propriété de longueur "modelList" doit être remis à zéro. Donc comme ça.

for (; i < modelList.options.length; ++i) { 
    modelList.options[i] = null; 
    modelList.length = 0; 
} }; </script> 

Answer 3

Ici code correct qui supprime le modèle manquant pour la liste des voitures:

<form> 
<select id="car_name"> 
<option value="car1">Car 1</option> 
<option value="car2">Car 2</option> 
<option value="car3">Car 3</option> 
</select> 
<select id="car_model"> 
</select> 
</form> 
<script type="text/javascript"> 
// Maps all available car models 
var modelMap = { 
'car1': [ 
    // Each entry contains the model's ID and text/label. 
    ['car1-1', 'Car 1.1'], 
    ['car1-2', 'Car 1.2'], 
    ['car1-3', 'Car 1.3'] 
], 
'car2': [ 
    ['car2-1', 'Car 2.1'], 
    ['car2-3', 'Car 2.2'] 
], 
'car3': [ 
    ['car3-1', 'Car 3.1'], 
    ['car3-2', 'Car 3.2'], 
    ['car3-3', 'Car 3.3'], 
    ['car3-4', 'Car 3.4'], 
    ['car3-5', 'Car 3.5'] 
] 
}; 

// Get the dropdown list elements. 
var nameList = document.getElementById('car_name'); 
var modelList = document.getElementById('car_model'); 

// Function to be called when the car name is changed 
nameList.onchange = function() { 

// Remove all old options if the new car has fewer models than a previous selection. 
for(i=modelList.options.length-1;i>=0;i--) 
{ 
    modelList.remove(i); 
} 

// Get the selected car. 
var selectedName = nameList.options[nameList.options.selectedIndex].value; 
// Lookup available models in the map. 
var availModels = modelMap[selectedName] || []; 

var i, opt; 

// Set available models in the model dropdown. 
for (i = 0; i < availModels.length; ++i) { 
    opt = availModels[i]; 
    modelList.options[i] = new Option(opt[0], opt[1]); 
} 

}; 
</script>