Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Смена checkbox и цвета ячейки в таблице (https://javascript.ru/forum/misc/67146-smena-checkbox-i-cveta-yachejjki-v-tablice.html)

IvanDaMaria 31.01.2017 11:02

Смена checkbox и цвета ячейки в таблице
 
Ответ на решение частично здесь , хочу развить. Ниже мой пример и реализация оттуда, прошу помощь объединить.

Есть html таблица, с особенными ячейками. Каждая ячейка "особенная" содержит один checkbox. Смысл в том чтобы менять её цвет кликом и устанавливать в checkbox флаг. Менять только у этих особенных. Они имеют класс в тэг <td>.

Реализовал смену цвета при установке флага в checkbox. Не знаю как сменить цвет кликом по ячейке. Не знаю как соединить это с флагом у checkbox, чтобы я с ним работать смог.

var boxes = $("input:checkbox"); 
var table = document.forms["table"];
var elements = table.getElementsByTagName('td');
var checkTd

//из всех ячеек выбираются только "особенные"
for (var i = 0; i < elements.length; i++) 
{
     if (elements[i].className == 'select_checkbox') 
      { checkTd +=elements[i]; }
}

$("input:checkbox").on("change", function () 
{ 
 
 for (var k = 0; k < boxes.length; k++) 
 {
   var checkbox = boxes[k];
   if ($(checkbox).prop('checked')) 
   { 
      if (checkbox == checkTd[k]) //если ячейка и checkbox по номеру совпали
      { checkTd[k].bgColor = '#ccc';}
     
      //далее шла работа с выбранными checkbox
   }
 }
     
});


Вот так выглядит "особенная" ячейка:

Код:

<td class="select_checkbox" onclick = "cellClick(td)">
Вот код по ссылке в начале.

function cellClick(td) {
        
        td.bgColor = '#006699';
        
        for (var childItem in td.childNodes) {
            if (td.childNodes[childItem].nodeType == 1)
            {
                td.childNodes[childItem].checked = true;
                td.querySelector("input[type=checkbox]").checked = true;
            }
        }

рони 31.01.2017 11:12

IvanDaMaria,
подожду телепата-переводчика

ksa 31.01.2017 11:20

Цитата:

Сообщение от IvanDaMaria
Есть html таблица, с особенными ячейками. Каждая ячейка "особенная" содержит один checkbox. Смысл в том чтобы менять её цвет кликом и устанавливать в checkbox флаг. Менять только у этих особенных. Они имеют класс в тэг <td>.

Ты хтмл примерчик челе сделай...

Dilettante_Pro 31.01.2017 12:45

IvanDaMaria,
<td class="select_checkbox" onclick = "cellClick(td)">

Эта td ни про что. Замените на this

IvanDaMaria 01.02.2017 17:41

Спасибо за ответы. Реализовал решение, а html таблица была по-дурацки рандомна и динамическая. можно удалять тему.


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