Dynamický seznam formuláře

Tohle je také pěkná věcička, představte si, že máte dva rozbalovací seznamy, přičemž obsah druhého, čili sekundární se mění v závisloti na tom, co vyberete v seznamu prvním, neboli primárním - nevíte o čem žvaním? Mrkněte dál...

Už je vám jasné, o čem jsem mluvil? Věřím, že ano, pojďme si tedy říci, jak na to.

Celý fígl opět spočívá ve správně zadaném kódu v poli Další atributy prvku prvního rozbalovacího seznamu, kde je zadáno:

onchange="dynamic1(this,'CarModel');"

A dále pak ve správně vychytralém zápisu Javaskriptu v příslušném poli záložky CSS a Javaskript, kde je v tomto případě zapsáno:

<script type="text/javascript">
function dynamic1(parent,child)
{
    var parent_array = new Array();
	// This is the default value
	parent_array[''] = ['Vyberte prosím výrobce'];
	// All other elements
	// parent_array['PARENT NAME'] = ['CHILD 1','CHILD 2','CHILD 3','ETC'];
	parent_array['Audi'] = ['A3','A4','A5','A6','A8','Q5','Q7','S3','S4','S5','S6','S8','RS6'];
	parent_array['Dacia'] = ['Sandero','Logan'];
	parent_array['FIAT'] = ['Bravo','Punto','Grande Punto'];
	parent_array['Peugeot'] = ['207','308','407','607'];
	parent_array['SEAT'] = ['Ibiza','New Ibiza','Leon'];
	parent_array['Skoda'] = ['Fabia','Octavia Tour','Octavia 2','Superb'];

	// Get the child
	var thechild = document.getElementById(child);

	// Remove all other options from the select element
	thechild.options.length = 0;

	// What value are we looking for ?
	var parent_value = parent.options[parent.selectedIndex].value;

	// No value found, use the default value
	if (!parent_array[parent_value]) parent_value = '';

	// Set the correct length
	thechild.options.length = parent_array[parent_value].length;

	// Add the options
	for(var i=0;i<parent_array[parent_value].length;i++)
	{
		thechild.options[i].text = parent_array[parent_value][i];
		thechild.options[i].value = parent_array[parent_value][i];
	}
}
</script>

A to je opět celé... :-)

A opět přeji hodně úspěchů v přípravě formuláře :-)