How to add multiple toggle condition

zizka

Hello, is there a way how to apply toggles from multiple inputs? For example this:

		$form->addRadioList("count", "Layers:", [1 => "1x", 2 => "2x", 0 => "None"])
			->addCondition($form::Equal, 0)
				->toggle(".layers", false);
		$form->addRadioList("color", "Color:", ["green" => "Green", "yellow" => "Yellow", "other" => "Other"])
			->setOption("class", "layers")
			->addCondition($form::Equal, "other")
				->toggle(".colorOther");
		$form->addText("colorOther", "Color:")
			->setOption("class", "layers colorOther");

The idea is that when I choose 1 and 2 as “count”, the “color” is shown. When I choose “other” color, the “colorOther” is shown. However when I keep “other” color selected and then choose “None” as count, the “colorOther” input is not hidden. Is there any way to achieve this?

Rick Strafy

Hi maybe you can try to use form groups, something like:

$form->addGroup();

$form->addRadioList("count", "Layers:", [1 => "1x", 2 => "2x", 0 => "None"])
	->addCondition($form::Equal, 0)
	->toggle("colors", false); // changed from .layers to colors, shows/hides whole html section

$form->addGroup()->setOption('container', Html::el('div')->setAttribute('id', 'colors'));

$form->addRadioList("color", "Color:", ["green" => "Green", "yellow" => "Yellow", "other" => "Other"])
	->setOption("class", "layers")
	->addCondition($form::Equal, "other")
	->toggle(".colorOther");

$form->addText("colorOther", "Color:")
	->setOption("class", "layers colorOther");

$form->addGroup();

Infanticide0

If the problem is only in hiding form controls, you have to use ID HTML attributes instead of class names.

https://doc.nette.org/…s/validation#…
Any selector can be passed as an argument to the toggle() method. For historical reasons, an alphanumeric string with no other special characters is treated as an element ID, the same as if it were preceded by the # character.

zizka

Rick Strafy wrote:

Hi maybe you can try to use form groups, something like:

$form->addGroup();

$form->addRadioList("count", "Layers:", [1 => "1x", 2 => "2x", 0 => "None"])
	->addCondition($form::Equal, 0)
	->toggle("colors", false); // changed from .layers to colors, shows/hides whole html section

$form->addGroup()->setOption('container', Html::el('div')->setAttribute('id', 'colors'));

$form->addRadioList("color", "Color:", ["green" => "Green", "yellow" => "Yellow", "other" => "Other"])
	->setOption("class", "layers")
	->addCondition($form::Equal, "other")
	->toggle(".colorOther");

$form->addText("colorOther", "Color:")
	->setOption("class", "layers colorOther");

$form->addGroup();

Thanks, that looks like it might work, I will try that, but it just means I'm already prescribing in the form definition how the result will be rendered. Isn't there some other option? I'd find it useful if there was some reverse approach – rather than using some form input value to determine what other elements it will show/hide, I could instead specify for a given element under what conditions it will be shown or hidden. Isn't there some way to achieve this?