Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #41 (permalink)  
Старый 16.10.2019, 10:05
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

laimas,
Простите, если я не прав и туплю
Но ведь это родитель основного флажка и блока со второстепенными.
на нём висит ваш код и код показать/скрыть дочерний блок .upsale__block__bot-right__sub-wrap, который выступает обёрткой для блоков со второстепенными чекбоксами.

Т.е. обработчик чекбокса там только один - ваш, а прерывание висит, чтобы при нажатии на чекбокс не срабатывал скрипт показать/скрыть блок
Ответить с цитированием
  #42 (permalink)  
Старый 16.10.2019, 10:26
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Aruta
Но ведь это родитель основного флажка и блока со второстепенными.
Ну естественно, ведь вы делегируете обработку флажков родителю. А в ней помимо моего кода и ваш, следовательно, если change не работает и заменить его на click, то не кучу обработчиков нужно вешать на родителя или на родителя плюс конкретный флажок, а либо в одном обработчике проверять источник и выполнять нужные операции или же разделять обработку событий посредством пространства имен.
Ответить с цитированием
  #43 (permalink)  
Старый 16.10.2019, 13:08
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

laimas,
Я наверное тупой
НО загвоздка не в главном чекбоксе, а то что событие клика не назначено на родителя второстепенных чекбоксов, чтобы активировать дочерний чекбокс.

Схематично если, то сейчас:
блок 1 > input.
click происходит по умолчанию на input, чтобы галка встала.

А надо:
блок 1 > input
click должен быть на блок 1, чтобы галка встала в input.

Представим что input в состоянии disabled и меняет своё состояние при нажатии на (в данном случае) родителя. Но при этом должен работать и тот код, который влияет на главный чекбокс.
Ответить с цитированием
  #44 (permalink)  
Старый 16.10.2019, 13:15
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Aruta
событие клика не назначено на родителя второстепенных чекбоксов
И как это понять?

Сообщение от Aruta
блок 1 > input.
click происходит по умолчанию на input, чтобы галка встала.

А надо:
блок 1 > input
click должен быть на блок 1, чтобы галка встала в input.
А это как переварить? Это "click происходит по умолчанию на input, чтобы галка встала" есть глупость, ибо установка и сброс флажка совершается одним и тем же действием, щелчком по нему, то бишь это всегда будет событие click.
Ответить с цитированием
  #45 (permalink)  
Старый 16.10.2019, 14:06
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

laimas,
.upsale__block__sub-right-wrap - родитель для всех блоков и на него вешается событие клика (show/hide блок) для .upsale__block__bot-right__sub-wrap

второстепенные input должны срабатывать при клике на .floor__item-wrap. Выше не надо подниматься для события click по этому чекбоксу

Получается логика такая:
кликаем на .floor__item-wrap и дочерний для него чекбокс получает/снимает с себя галку, а далее уже работает функция установки и проверки состояния on/off для главного чекбокса.

Чтобы не путаться, то можно сделать второстепенные чекбоксы как disabled (в html хардкодом) и, тогда нужно обработчик клика по чекбоксу перенести на .floor__item-wrap.
Вот именно этот перенос обработчика клика и нужно добавить в ваш код, чтобы всё работало не конфликтуя

Порядок (при клике на .floor__item-wrap):
click по .floor__item-wrap -> проверка состояния дочернего input для этого блока -> ставим/снимаем галку в input (if есть галка уже/нет галки) -> проверка на состояние остальных input в оставшихся .floor__item-wrap -> снятие/установка галки в inpit в .upsale__block__bot-right__title-wrap

<div class="upsale__block__sub-right-wrap">
						<div class="upsale__block__bot-right__title-wrap dflex">
							<div class="upsale__block__bot-right__title dflex">
								<input id="floor" type="checkbox" class="block__check" onclick="event.stopPropagation()"> // этот input "главный". stopPropagation() добавлен, чтобы при нажатии на input не срабатывал скрипт click для upsale__block__bot-right__title-wrap			
								<span>
									<img class="arrow arrow-up" src="" alt="arrow_down">
									Choose your floor
								</span>
							</div>
							<div class="col-title__price-wrap dflex">
								<div></div>
								<div></div>
								<div></div>
							</div>
						</div>
						<div class="upsale__block__bot-right__sub-wrap dnone" style="display: block;">
							<div class="montage__content-wrap">
								<span class="montage__text">intro text 
								<div class="montage__floor-wrap montage__comp-wrap dflex">
									<div class="montage__floor dflex">
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="first_floor" type="checkbox" name="groundfloor" value="groundfloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Ground floor</span>
												</div>
											</div>
										</div>      //закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="sec_floor" type="checkbox" name="middlefloor" value="middlefloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Second floor</span>
												</div>
											</div>
										</div>	//закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="third_floor" type="checkbox" name="topfloor" value="topfloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Third floor</span>
												</div>
											</div>
										</div>  //закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">  //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="all_floor" type="checkbox" name="apartment" value="apartment"> //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Apartment Building</span>
												</div>
											</div>
										</div>  //закрытие блока .floor__item-wrap
									</div>
								</div>
							</div>			
						</div>			
					</div>

Последний раз редактировалось Aruta, 16.10.2019 в 14:37.
Ответить с цитированием
  #46 (permalink)  
Старый 16.10.2019, 17:17
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Охренеть. Чем в конце концов должен заниматься флажок id="floor":
а) только показывать/скрывать блок?
б) показывать/скрывать блок и выбирать все второстепенные флажки?
Ответить с цитированием
  #47 (permalink)  
Старый 16.10.2019, 17:20
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

laimas,
Сообщение от laimas
Чем в конце концов должен заниматься флажок id="floor":
только отключать второстепенные флажки и включаться, когда хотя бы один из них включен.
Ответить с цитированием
  #48 (permalink)  
Старый 16.10.2019, 18:05
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Aruta
только отключать второстепенные флажки
То есть наоборот - выбор этого флажка, это сброс последующих, а выбрать им все последующие нельзя?

Блоков upsale__block__sub-right-wrap на этой странице всегда два?

Последний раз редактировалось laimas, 16.10.2019 в 18:17.
Ответить с цитированием
  #49 (permalink)  
Старый 16.10.2019, 18:26
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

Сообщение от laimas
То есть наоборот - выбор этого флажка, это сброс последующих, а выбрать им все последующие нельзя?
Верно

Сообщение от laimas
Блоков upsale__block__sub-right-wrap на этой странице всегда два?
Пока два, т.к. пока хардкод в этой части, но страница динамическая и когда запрограммирую php, то там может быть и более 7 таких блоков.
https://prnt.sc/pk5amz

Последний раз редактировалось Aruta, 16.10.2019 в 18:30.
Ответить с цитированием
  #50 (permalink)  
Старый 16.10.2019, 19:02
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Ясно.Дело в том, что в первом блоке оказывается есть и другие поля, но типа file, а значит селектор для делегирования нельзя так указывать.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Замыливание нескольких div-ов при наведении на один из элементов wayrus161 Элементы интерфейса 2 31.08.2018 07:20
Выделение строки <select> при выборе checkbox DarkMaster13 Общие вопросы Javascript 4 14.04.2014 03:30
Неповторяющаяся заставка (при возвращении с других страниц сайта) thrastogotch jQuery 3 07.06.2012 17:57
Как при наведении на один объект изменять стили других? greysells jQuery 4 06.12.2009 11:00
Выделение checkbox при условии атрибута... SashaBorandi jQuery 1 07.02.2009 14:18