2

Я вывожу модный модуль Bootstrap, который позволяет пользователям выбирать несколько флажков. Затем в моем представлении я хочу пропустить каждый из них и проверить, проверены ли они.Найти все проверенные флажки в базовой линии

Вот мой модальный код:

<div class="modal fade" id="ethnicityModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
     <h4 class="modal-title" id="myModalLabel">Ethnicity Targeting</h4> 
     </div> 
     <div class="modal-body"> 
     <h5>Select ethnicities that should be included:</h5> 
     <input type="checkbox" name="caucasian"><label for="#caucasian"> Caucasian</label> 
     <br> 
     <input type="checkbox" name="black"><label for="#black"> African American</label> 
     <br> 
     <input type="checkbox" name="hispanic"><label for="#hispanic"> Hispanic/Latino</label> 
     <br> 
     <input type="checkbox" name="middleEastern"><label for="#middleEastern"> Middle Eastern</label> 
     <br> 
     <input type="checkbox" name="pacific"><label for="#pacific"> Pacific Islander</label> 
     <br> 
     <input type="checkbox" name="nativeAmerican"><label for="#nativeAmerican"> Native American/Alaskan</label> 
     <br> 
     <input type="checkbox" name="other"><label for="#other"> Other</label> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-primary saveEthnicity" data-dismiss="modal">Save</button> 
     </div> 
    </div> 
    </div> 
</div> 

И на мой взгляд:

events: 
    "click .saveEthnicity": "saveEthnicity" 

saveEthnicity: (e) -> 
    console.log e.currentTarget.parentElement.parentNode.children[1].children 

Так e.currentTarget.parentElement.parentNode.children[1].children возвращает мне массив дочерних элементов. Но я не могу их пропустить. Я попробовал

e.currentTarget.parentElement.parentNode.children[1].children.each (child) -> 
    console.log child 

Но это вызывает ошибку. Любая идея, как я могу добраться до каждого входа, чтобы я мог сделать .checked()?

ответ

2

Если вид Backbone правильно представляет ваше модальное окно, то вы можете просто найти все проверяемых коробки с немного JQuery:

var $checkedBoxes = this.$('input:checked'); 

От Backbone docs:

Каждый вид имеет $ Функция, которая запускает запросы, в которых используется элемент вида

Если модальная не представлена Ted непосредственно зрения, то вы можете просто поиск по дереву DOM, пока не найдете ближайшую модальность:

var $checkedBoxes = $(e.currentTarget).closest('modal').find('input:checked') 
+0

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

+0

@TomHammond. Вы должны определенно использовать что-то, чтобы определить, какая модальная кнопка отправляет. – Jivings

+0

@TomHammond Я дал вам альтернативу. – Jivings

1

Свойства children не массив, это HTMLCollection, попробуйте следующее:

children = [].slice.apply(e.currentTarget.parentElement.parentNode.children[1].children) 
children.forEach (child) -> console.log(child) 
+0

Ahhh, это имеет большой смысл. Спасибо за помощь! –

Смежные вопросы