Как отсортировать флажки по классу, значению и проверено
У меня есть div,#subfilterNamesContainer
, который содержит список флажков. Я пытаюсь написать функцию, которая будет сортировать флажки по 3 разделам.
class="default"
должен быть вверху, упорядоченным по значению, независимо от того, отмечен он или нет.Тогда мне нужно перечислить флажки, которые не являютсяclass="default"
которые проверены, упорядочены по значению.Наконец мне нужно показать все НЕclass="default"
которые не проверяются и снова упорядочены по значению.Было бы идеально иметь горизонтальное правило между этими тремя разделами.
Как я могу сделать эту задачу? Цель состоит в том, чтобы показывать пользовательские флажки по умолчанию вверху, за которыми следуют флажки не по умолчанию, которые отмечены, а затем флажки не по умолчанию, не отмеченные. Это не должно реагировать на проверку пользователей, только когда эта новая функцияsortGiveNamesFilter
) называется.
<div id="subfilterNamesContainer">
<input type="checkbox" value="X"> X <br>
<input type="checkbox" value="A"> A <br>
<input type="checkbox" value="A B" class="default"> A B <br>
<input type="checkbox" value="A A" class="default"> A A <br>
<input type="checkbox" value="F"> F <br> <--THiS ONE WILL BE CHECKED
<input type="checkbox" value="E"> E <br> <--THiS ONE WILL BE CHECKED
</div>
Окончательный результат при вызове моей новой функции:
<div id="subfilterNamesContainer">
<input type="checkbox" value="A A" class="default"> A A <br>
<input type="checkbox" value="A B" class="default"> A B <br>
<hr>
<input type="checkbox" value="E"> E <br> <--THiS ONE WILL BE CHECKED
<input type="checkbox" value="F"> F <br> <--THiS ONE WILL BE CHECKED
<hr>
<input type="checkbox" value="A"> A <br>
<input type="checkbox" value="X"> X <br>
</div>