Form Toggling elements based on Checkbox Select value

We use bootstrap's Toggle implementation in the Forms. It can be used if you want to show or hide a certain Section, Group or Input based on the value of another Input (mostly a Checkbox or Select).

Basically you'd want to add a class to all the Elements you want to toggle; eg. $section->addClass('toggle-remote-logging');. To toggle them, call the toggle method on the Input that should act as a trigger, eg $input->toggle('toggle-remote-logging'). As you might notice, the toggle argument is simply a css selector.

Here are a few examples:

Toggle a single input based on the state of a radio-button (source)

$group->add(new Form_Checkbox(
	'protocol',
	'Protocol',
	'HTTP',
	($pconfig['webguiproto']=='http'),
	'http'
))->displayAsRadio()->toggles('#ssl-certificate');

$group->add($input = new Form_Checkbox(
	'protocol',
	'Protocol',
	'HTTPS',
	($pconfig['webguiproto']=='https'),
	'https'
))->displayAsRadio()->toggles('#ssl-certificate');

$section->add($group);

### This input automatically gets the id=ssl-certificate, so no addClass is necessary
$section->addInput($input = new Form_Select(
	'ssl-certificate',
	'SSL Certificate',
	$pconfig['ssl-certref'],
	$values
));

if ($pconfig['webguiproto'] == 'http')
	$input->addClass('collapse');

Toggle a Group of Inputs based on a Checkbox (source)

$section->addInput(new Form_Checkbox(
	'monitor_disable',
	'Gateway Monitoring',
	'Disable Gateway Monitoring',
	$pconfig['monitor_disable']
))->toggles('.toggle-monitor-ip')->setHelp('This will consider this gateway as always being up');

$group = new Form_Group('Monitor IP');
$group->addClass('toggle-monitor-ip', 'collapse');

if (!$pconfig['monitor_disable'])
	$group->addClass('in');

$group->add(new Form_Input(
	'monitor',
	null,
	'text',
	($pconfig['gateway'] == $pconfig['monitor'] ? '' : $pconfig['monitor'])
))->setHelp('Enter an alternative address here to be '.
	'used to monitor the link. This is used for the quality RRD graphs as well as the '.
	'load balancer entries. Use this if the gateway does not respond to ICMP echo '.
	'requests (pings).');
$section->add($group);

We have customized this setup to allow toggling based on the value of a Select as well, we use the same setup but for the trigger we the special ->toggles(null). The target is determined by looking for Elements with the class '.toggle-$OPTION_VALUE'.

Show a certain Section based on the value of a Select (source)

$section->addInput(new Form_Select(
	'type',
	'Type',
	isset($pconfig['type']) ? $pconfig['type'] : $tab,
	$types
))->toggles(null);

$form->add($section);

foreach ($types as $type => $typeName)
{
	$section = new Form_Section('Details for '. $typeName);
	$section->addClass('toggle-'.$type.' collapse');

	...
}

There are also more advanced setups possible, a good one can be found in system_camanager.php. The method select toggles both Sections, and individual Inputs within that Section at the same time. Have a look at the various addClass calls that occur