Вот мой html, который я использую в приложении Django:
<div id="mahal_questions" class="showHide_div">
{{soldier.mahal_status.label_tag}}
{{soldier.mahal_status}}
{{soldier.mahal_status.errors}}
{{soldier.mahal_program.label_tag}}
{{soldier.mahal_program}}
{{soldier.mahal_program.errors}}
<p>
{{soldier.mahal_id.label_tag}}
{{soldier.mahal_id}}
{{soldier.mahal_id.errors}}</p>
</div>
{{soldier.currently_serving.label_tag}}
{{soldier.currently_serving}}
<div id="currently_serving_questions" class="showHide_div">
{{soldier.idf_id.label_tag}}
{{soldier.idf_id}}
{{soldier.idf_id.errors}}
<p></p> <!--prevents the error message from running into the next label-->
{{soldier.army_unit.label_tag}}
{{soldier.army_unit}}
{{soldier.army_unit.errors}}
<p>{{soldier.tafkid.label_tag}}
{{soldier.tafkid}}
{{soldier.tafkid.errors}}</p>
</div>
У меня есть два элемента div, каждый из которых включает 3 поля. mahal_questions включает в себя mahal_status, mahal_program и mahal_id current_serving_questions включает в себя поля idf_id, army_unit и tafkid.
По какой-то причине, когда я l oop через мои div и внутри каждого div, l oop через мои элементы, Я вижу только первые два элемента в каждом div. Последний элемент игнорируется. (Я думаю, что эта проблема могла начаться, когда я добавил некоторые элементы <p>
, но я не уверен.)
Вот мой js (метод предназначен для l oop через каждый элемент div на странице, и если div скрывается, пропустите через элементы l oop и сотрите их значение при отправке, чтобы значения скрытых полей не отправлялись в БД):
$('#intake_form').submit(function() {
var showhideDivList = document.getElementsByClassName("showHide_div"); //To avoid errors on a page with no show/hides
if (showhideDivList.length > 0) {
//get each show/hide div
Array.from(showhideDivList).forEach(function (div) {
console.log(div);
//if this div is hidden
if ($(div).is(":hidden")){
// //for each element that is going to be shown/hidden within the div
var elements = $(div).children();
console.log("elements.length:" + elements.length);
for (var i = 0; i < elements.length; i++) {
var element = elements.eq(i);
console.log(element);
console.log("value", element.val());
element.val("");
console.log("value", element.val());
}
}
});
}
});