ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Родительский и дочерний чекбокс
9 сообщений из 9, страница 1 из 1
Родительский и дочерний чекбокс
    #39134724
TemichRus
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
TemichRus
Гость
Добрый день, пытаюсь написать скрипт на чекбоксы.
Практически получился нужный, но он немного неправильно работает.
Когда хотябы один дочерний чекбокс включен, то родительский чекбокс тоже включен.
А мне нужно чтобы когда хотя бы один дочерний включен, родительский чекбокс наоборот выключается.
Т.е
1.1 = on
1.2 = off
Соответственно 1 = off
И также с All зависимо от всех input.
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
<script type="text/javascript">
$(document).ready(function (){
    $('input:checkbox').click(function (){
        var ok=this.checked;
        //this.checked=!ok;
        $(this).next().find('input:checkbox').each(function (){
            this.checked=ok;
        });
        if (ok) {
            $(this).parents('li').children('input:checkbox').each(function (){
                            this.checked=true;
                                                           
            });
        } else {
            $(this).parent().parents('li').each(function (){
                            if ($(this).find('input:checked').length>1) return true;
                            $(this).children('input:checkbox').get(0).checked=false;
            });
        };
    });
});
</script>


Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
<body>
    <form action="index.php" method="POST">
        <ul class="shest2">
            <li>All<input class="all_filter" name="All" value="1" type="checkbox" checked>
                <ul class="shest2">
                    <li>1<input type="checkbox" checked>
                    <ul>
                        <li>1.1<input name="cfu[]" value="1" type="checkbox" checked></li>
                        <li>1.2<input name="cfu[]" value="1"  type="checkbox" checked></li>
                    </ul>
                    </li>
                    <li>2<input type="checkbox" checked>
                    <ul>
                        <li>1.1<input name="cfu[]" value="1"  type="checkbox" checked></li>
                        <li>1.2<input name="cfu[]" value="1"  type="checkbox" checked></li>
                    </ul>
                    </li>
                </ul>
                </li>
        </ul>
        <input type="submit">
    </form>
</body>


Спасибо заранее.
...
Рейтинг: 0 / 0
22.12.2015, 15:24
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39134865
oaken
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
oaken
Участник
Для начала не плохо иметь четкое описание логики работы скрипта.
Неясно почему при клике на вышестоящем чекбоксе проставляются дочерние, почему изначально все cheched? Как это согласуется с вышеуказанным требованием.
...
Рейтинг: 0 / 0
22.12.2015, 16:53
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39134904
TemichRus
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
TemichRus
Гость
oaken,

Вышестоящий all отмечает все чекбоксы,
Чекбоскы 1 и 2 отмечают все 1.х и 2.х соответственно.
Все checked выставлены заранее, чтобы не писать лишнюю проверку для all
...
Рейтинг: 0 / 0
22.12.2015, 17:17
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39134907
TemichRus
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
TemichRus
Гость
oaken,

Извиняюсь, там где вторая пара 1.1 и 1.2 это на самом деле 2.1 и 2.2
...
Рейтинг: 0 / 0
22.12.2015, 17:21
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39137180
oaken
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
oaken
Участник
TemichRus,

у тебя противоречие в требованиях, ну или ошибка, 4ое предложение первого поста.
...
Рейтинг: 0 / 0
24.12.2015, 14:31
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39138539
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Тshаmil
Участник
Если я правильно понял задачу, рабочий пример на планкере http://plnkr.co/edit/r323BsqN5j40WaTmscLQ код:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
(function($){
    $('document').ready(function(){
            $('.all_filter').change(function(){
              if ($(this).prop('checked')) {
                $('input:checkbox:not([name*=cfu])').prop('checked', true);
                $('[name*=cfu]').prop('checked', true);
              } else {
                $('input:not([name*=cfu])').prop('checked', false);
                $('[name*=cfu]').prop('checked', false);
              }
              
            });
            
            $('input:checkbox:not([name*=cfu], .all_filter)').change(function(){
              if (!$(this).prop('checked')) {
                $('.all_filter').prop('checked', false);
              } else {
                
                var allChecked = true;
                
                $('input:checkbox:not([name*=cfu], .all_filter)').each(function(index){
                  if (!$(this).prop('checked')) {
                    $('.all_filter').prop('checked', false);
                    allChecked = false;
                  }
                });
                
                $('.all_filter').prop('checked', allChecked);
              }
            });
            
            $('input[name*=cfu]').change(function(){
                if (!$(this).prop('checked')) {
                  $('.all_filter').prop('checked', false);
                  $(this).closest('ul').parent().children('input:checkbox').prop('checked', false);
                } else {
                  var allChecked = true;
                  
                  $(this).closest('ul').children('input:checkbox').each(function(index){
                      if (!$(this).prop('checked')) {
                        $(this).closest('ul').parent().children('input:checkbox').prop('checked', false);
                        allChecked = false;
                      }                    
                  });
                  
                  $(this).closest('ul').parent().children('input:checkbox').prop('checked', allChecked);
                  $('.all_filter').prop('checked', allChecked);
                }
            });
    });
})(jQuery);



вообще получилось кучеряво, если бы я решал эту задачу, то я по другому продумал бы html структуру и прописал бы вспомогательные атрибуты элементам для более оптимального использования селекторов, тогда бы код скрипта получился бы гораздо проще, и не пришлось бы городить кучерявые селекторы. В данной ситуации я исходил из той структуры что есть
...
Рейтинг: 0 / 0
26.12.2015, 04:16
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39138628
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
ТshаmilЕсли я правильно понял задачу, рабочий пример на планкере http://plnkr.co/edit/r323BsqN5j40WaTmscLQ Здесь при щелчке по 1 (или 2 ), почему-то не снимаются галочки с дочерних 1.1-1.2 .

Сделал без jQuery, нормально работает в любых комбинациях галочек   Дерево может иметь неограниченное число уровней. https://jsfiddle.net/sad9paua/1/embedded/result/
Кому интересны исходники, то надо из url убрать /embedded/result/
...
Рейтинг: 0 / 0
26.12.2015, 16:04
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39138672
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Тshаmil
Участник
user89ТshаmilЕсли я правильно понял задачу, рабочий пример на планкере http://plnkr.co/edit/r323BsqN5j40WaTmscLQ Здесь при щелчке по 1 (или 2 ), почему-то не снимаются галочки с дочерних 1.1-1.2 .

Сделал без jQuery, нормально работает в любых комбинациях галочек   Дерево может иметь неограниченное число уровней. https://jsfiddle.net/sad9paua/1/embedded/result/
Кому интересны исходники, то надо из url убрать /embedded/result/
да, точно есть ошибка. так не честно:) ты поменял исходную структуру html если правильно поменять структуру то задача вообще решается несколькими строчками кода и рекурсией.
...
Рейтинг: 0 / 0
26.12.2015, 19:26
| Ответить | Цитировать | Написать  
Родительский и дочерний чекбокс
    #39138822
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
Тshаmilты поменял исходную структуру htmlне совсем... Структура осталась прежней, <label> здесь только, чтобы галочки ставить, щелкая по названиям.

Тshаmilесли правильно поменять структуру то задача вообще решается несколькими строчками кода и рекурсией.Тоже хотел через setAttribute , но если дерево динамическое, то выгоды нет.
...
Рейтинг: 0 / 0
27.12.2015, 12:39
| Ответить | Цитировать | Написать  
9 сообщений из 9, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Родительский и дочерний чекбокс
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]