Я создаю систему фильтров, используя AJAX.Один из фильтров содержит кучу флажков с интересами.
Я создал эти флажки и создал стили с помощью библиотеки iCheck JS.Вот так:
<div class="interests">
<div class="category-title mt-3">
<h4 class="card-title mb-0">Interesses <span class="small"><a href="#" id="resetInterests">(wissen)</a></span></h4>
<hr>
</div>
<div class="sidebar-list">
<ul class="skin-square skin searchinterests">
<?php
foreach ($interests as $int) {
$id = "interest-" . $int->interest_id;
?>
<li>
<input type="checkbox" id="<?=$id?>" name="interests[]" value="<?=$int->interest_id?>">
<label for="<?=$id?>">
<?=$int->full_name?>
</label>
<span class="pull-right">49</span>
</li>
<?php
}
?>
</ul>
</div>
Тогда в моем javascript есть следующий код:
var searchSelectedInterests = [];
$(document).ready(function(){
'use strict';
// Square Checkbox & Radio
$('.skin-square input').iCheck({
checkboxClass: 'icheckbox_square-blue'
});
$('.searchinterests input').on('ifChecked', function(event) {
var interestid = event.target.value;
searchSelectedInterests.push(interestid);
performSearch();
});
$('.searchinterests input').on('ifUnchecked', function(event) {
var interestid = event.target.value;
var arrayPos = $.inArray(interestid, searchSelectedInterests);
if (arrayPos > -1) {
searchSelectedInterests.splice(arrayPos, 1);
}
performSearch();
});
$('#resetInterests').on('click', function(e) {
e.preventDefault();
$("input[name='interests[]']").iCheck('uncheck');
});
});
Проблема в том, что iCheck ('uncheck') вызовет событие ifUnchecked для каждого отдельного флажка, который я хочу снять (если было отмечено 10 флажков, он выполнит мой запрос поиска AJAX 10 раз).Это дает мне нежелательные результаты, я бы предпочел, чтобы все флажки были сняты, а событие ifUnchecked сработало один раз.