Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Выбор radiobutton в ячейке таблицы (https://javascript.ru/forum/misc/27337-vybor-radiobutton-v-yachejjke-tablicy.html)

klev2004 10.04.2012 02:10

Выбор radiobutton в ячейке таблицы
 
Есть таблица с ячейками, в каждой из которых есть элемент input с типом radio. Смысл такой - при клике мышей на ячейку таблицы должен устанавливаться в selected радиобаттон, который расположен внутри этой ячейки. Написал такую вот функцию, реализована подсветка выбранной ячейки, но не знаю как правильно в ячейки найти элемент типа input и установить ему атрибут checked.

function cellClick(td) {
    var elements = document.getElementsByTagName('td');
    for (var i = 0; i < elements.length; i++)
    {
        if(elements[i].className=='select_pay_radio')
        {
            elements[i].bgColor='#EFEFEF';
            // тут перекрашиваю все ячейки в один цвет (деактивирую, если какая-то уже была выбрана до этого)
        }
    }
    td.bgColor='#ccc';
    // здесь выделяю выбранную ячейку другим цветом
    // и тут же нужно в этой ячейке отметить флагом checked input типа radio
  }

cmygeHm 10.04.2012 11:12

У тебя есть td, который как я понимаю является кликнутой ячейкой.

Далее все просто:
for (var childItem in td.childNodes) {
    if (td.childNodes[childItem].nodeType == 1)
       td.childNodes[childItem].checked = true;
}

Обход детей: здесь

GuardCat 10.04.2012 11:58

ie 9+
td.querySelector("input[type=radio]").checked = true;

klev2004 10.04.2012 12:57

cmygeHm, GuardCat, спасибо! Оба варианта работают.
Оказывается я пробовал уже их применять, но не указывал td. а вместо него писал elements.

Возможно кому-то тоже понадобится такая функция:

function cellClick(td) {
    var elements = document.getElementsByTagName('td');
    // снимаем со всех ячеек выделение цветом (если было установлено ранее)
    for (var i = 0; i < elements.length; i++)
    {
        if(elements[i].className=='select_pay_radio')
        {
            elements[i].bgColor='#EFEFEF';
        }
    }
    // устанавливаем другой цвет для выбранной ячейки
    td.bgColor='#ccc';
    // активируем radio внутри выбранной ячейки
    for (var childItem in td.childNodes)
    {
        if (td.childNodes[childItem].nodeType == 1)
        {
           td.childNodes[childItem].checked = true;
        }
    }
  }

cmygeHm 10.04.2012 13:09

На здоровье! Расти большой! :)
Да, в моем варианте действительно надо бы убеждаться, что это радиобатон, а то сделаешь checked = true для какого-нибудь textarea :)


Часовой пояс GMT +3, время: 15:34.