toggle() on RadioList not working in Internet Explorer 11

[Koricz]

protected function createComponentTestForm()
{
    $form = new Nette\Application\UI\Form();

    $form->addGroup();

    $form->addText('field', 'Visible field')->setRequired('Fill %label');

    $form->addRadioList('switch', NULL, array('hide' => 'Hide', 'show' => 'Show'))
        ->setDefaultValue('hide')
        ->addCondition(\Nette\Application\UI\Form::EQUAL, 'show')
        ->toggle('show-container');

    $form->addGroup()->setOption('container', \Nette\Utils\Html::el('div')->id('show-container'));

    $form->addText('hiddenField', 'Hidden field')
        ->addConditionOn($form['switch'], \Nette\Application\UI\Form::EQUAL, 'show')
        ->setRequired('Fill %label');

    $form->addGroup();

    $form->addSubmit('send', 'Add');

    return $form;
}

show-container is properly hidden at the start, but is not visible when second radio is selected.

Javascript validation on hiddenField also not working.

In Firefox and Chrome everything works as expected.

[mkoubik]

I've made some research and it is caused by different behavior of form.elements.namedItem() in MSIE and the rest of the browsers.

form.elements in MSIE returns HtmlCollection interface implementation whereas other browsers return HtmlFormControlsCollection which is not event defined in IE.

The difference is that in case there are more inputs with the same name (as in radio list) HtmlFormControlsCollection.namedItem('name') returns RadioNodeCollection containing all inputs, whereas HtmlCollection.namedItem('name') returns only the first one (so toggle works only on the first item of radio list).

I've written a naive implementation of polyfill that solves this issue, but a more performance-friendly fix has to be made.