RadioGroup

import RadioGroup from '@19h47/radiogroup';

const $element = document.querySelector('[role="radiogroup"]');
const radiogroup = new RadioGroup($element);

radiogroup.init();

Japan condimentsBlack vinegar

Pizza CondimentsBlack olives

Control Never gonna let you down

Disable or enable programmatically a radiogroup

Thanks to customs events we can programmatically change the current selected radio.

import RadioGroup from '@19h47/radiogroup';

const $element = document.querySelector('[role="radiogroup"]');
const $select = document.querySelector('select');
const radiogroup = new RadioGroup($element);

radiogroup.init();

radiogroup.radios.forEach(radio => {
	const { $input: { value } } = radio; // Grab the input value

	radio.el.addEventListener('Radio.activate', () => {
		[...$select.options].forEach(option => {

			if (value === option.value) {
				option.selected = true;
			} else {
				option.selected = false;
			}
		});
	}
});

American condimentsMayonnaise

CondimentsSavora

Anise spiritsFrench pastis and absinthe

Star rating1