У меня есть группа переключателей в div, у которой есть div div, который содержит различные текстовые поля, 4 уровня вниз. Если установлен флажок "false", мне нужно проверить все текстовые поля для этой группы, и если какое-либо текстовое поле имеет значение, выведите предупреждение.
В настоящий момент он выдает два предупреждения для любой "ложной" кнопки, независимо от значений в текстовых окнах. Я не уверен, почему он удваивает предупреждение для любого "ложного" переключателя, но я уверен, что он фактически не читает текстовые поля.
Я предполагаю, что метод find() будет смотреть на несколько уровней детей.
EDIT - я должен также упомянуть, что есть 5 вопросов, поэтому весь "вопрос" класс повторяется 5 раз, и когда нажата кнопка отправки, ему необходимо проверить каждый вопрос.
Вот разметка:
<div class="question">
<div class="radio-buttons">
<input type="radio" name="radios" value =" true" />Yes
<input type="radio" name="radios" value =" false" />No
</div>
<div class="label">List out the date, name & category....</div>
<div class="answer-container">
<fieldset class="answer-container-sub">
<div class="answer-group">
<div class="question-label">Name</div>
<div class="question-answer">
<input type="text" />
</div>
<div class="question-label">Name</div>
<div class="question-answer">
<input type="text" />
</div>
</div>
<div class="answer-group">
<div class="question-label">Name</div>
<div class="question-answer">
<input type="text" />
</div>
<div class="question-label">Name</div>
<div class="question-answer">
<input type="text" />
</div>
</div>
</fieldset>
</div>
</div>
<input type="submit" id="button" value="Click Me" />
jQuery ## Изменено для изменения имени класса в приведенном ниже коде, чтобы он соответствовал указанному выше html. ##
$("#button").on("click", function () {
$('input:radio').each(function () {
if ($(this).closest('.radio-buttons').find('input:checked').val() == "False") {
if ($(this).siblings('.answer-container').find('input[type=text]').val() != '') {
alert("You clicked no but a textbox has a value");
}
}
});
});
Некоторые из проблем, связанных с перемещением, могут иметь отношение к тому факту, что в ваших значениях радио HTML есть ведущее место, например "true". Это пространство необходимо удалить.
Я принял другой подход (потому что часть вашей разметки, которую вы указали в коде jQuery, отсутствует в этом сообщении) и создала этот http://jsfiddle.net/jayblanchard/dGqwZ/, который показывает, насколько легко будет проходить через DOM,
$('input[name="radios"]').change(function() {
var currentValue = $(this).val(); // spaces need to be removed from radio values in HTML
if('false' == currentValue) {
var answers = $(this).closest('.question').find('.answer-container .question-answer');
$(answers).find('input').each(function() {
var answerValue = $(this).val();
if('' != answerValue) {
alert(answerValue);
}
});
}
});