Поиск выбранного RADIO в HTML форме средствами javascript

Продемонстрирую алгоритм работы с полем radio для универсального случая, когда мы не знаем существует ли поле, одно у него значение в форме или оно может принимать значение из некоторого набора (случай списка из радио-кнопок).

На практике, часто задача стоит так, что нам нужно определить выбран ли какой то элемент radio-списка в форме, и если выбран, то получить его значение (то что задано в атрибуте value).

Если элемент не существует или же переключатель не выбран — будем возвращать false. В других случаях вернем значение элемента.

Пусть существует такая форма:

Мы не знаем сколько радио-элементов с именем chosen в списке. Их может не быть вообще.

Для начала нужно получить доступ к форме, содержащей radio элемент. Можно обратиться к общему списку форм документа:

но более надежный способ, найти форму по ID:

Теперь нужно понять, что представляет из себя chosen — одно поле или список. И, наконец, проверить его состояние checked — выбран ли он.

frm.elements.chosen, в зависимости от числа элементов, может быть то HTMLInputElement, то RadioNodeList или вообще отсутствовать, а frm.elements.chosen[0] может отсутствовать (быть undefined) или быть HTMLInputElement. На этом и строится логика проверки.

Мало букафф? Читайте есчо !

Как получить значение из mui TextField

Июнь 18, 2023 г.

React компонент TextField библиотеки @mui/material - это сложный элемент и получить значение через свойство ref нельзя. Разработчики понимали, что доступ к HTMLInputElement внутри компонента нужно предоставить, и потому реализовали свойство inputRef, ...

Читать

Показ навигации и пагинатора swiper js за пределами контейнера

Апрель 11, 2018 г.

swiper js - jQuery плагин для создания адаптивной карусели  картинок. Посмотрим как сверстать шаблон так, чтобы элементы управления слайдером можно было размещать за пределами контейнера слайдера. SWIPER на GITHUB. Это стандартный шаблон, который ...

Читать

Обмен данных Angular с бек-энд на PHP

Ноябрь 11, 2016 г.

Стоит ли рассказывать, что Ангуляр при всей своей прелести лишь одна сторона медали - frontend, который как то должен взаимодействовать со второй половинкой ...

Читать

Асинхронная загрузка и инициализация js скрипта

Май 13, 2022 г.

С тех пор как стало возможным указать загружаемому в HTML документе скрипту флаги-аттрибуты async и defer, стало необходимо понимать то, в какой очередности скрипты будут исполнены, если они зависят друг от друга. Так если ваш скрипт зависит от ...

Читать
 

Комментарии к «Поиск выбранного RADIO в HTML форме средствами javascript»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: