I tra to filter the uk-filter from a button or a checkbox.
I understand that I can create a filter, in the that contains .js-filter. but I want to create a checkbox outside the div. so how can a call or set a posible selecction.
This is what I have.
<div uk-filter=".js-filter" data-id="page#4" id="page#4" class="uk-margin">
<ul class="el-nav uk-margin uk-subnav uk-subnav-pill">
<li class="uk-active" uk-filter-control="">
<a href="">All</a>
</li>
<li uk-filter-control="[data-tag~='Anual']">
<a href="#">Anual</a>
</li>
<li uk-filter-control="[data-tag~='Temporada']">
<a href="#">Temporada</a>
</li>
</ul>
<div class="js-filter uk-child-width-1-1 uk-child-width-1-2@m uk-grid-match uk-grid" uk-grid="">
<div data-tag="Anual Temporada" class="uk-first-column">
<div class="el-item uk-card uk-card-primary uk-card-small uk-card-body uk-margin-remove-first-child">
<h3 class="el-title uk-card-title uk-margin-remove-top uk-margin-remove-bottom">
<a href="" class="uk-link-reset">Triplex MI 47</a>
</h3>
<a href="">
</a>
<div class="el-content uk-panel uk-margin-top"><p style="column-count: 2; font-family: Montserrat; font-size: 14px;">info</p></div>
</div></div>
<div>
<div class="el-item uk-card uk-card-primary uk-card-small uk-card-body uk-margin-remove-first-child">
<h3 class="el-title uk-card-title uk-margin-remove-top uk-margin-remove-bottom">
<a href="" class="uk-link-reset">Botafoch MI35</a> </h3>
<a href="">
</a>
<div class="el-content uk-panel uk-margin-top"><p style="column-count: 2; font-family: Montserrat; font-size: 14px;">info</p>
<p style="text-align: justify;">info</p></div>
</div></div>
</div>
</div>
This is the function i call from a onclick
function myFunction() {
var filter = document.querySelector('.js-filter');
var filterBar= document.querySelector('#page#4');
var activeFilter= document.querySelector('div [data-tag:'Anual']');
UIkit.filter( filterBar, {
target: filter,
selActive: activeFilter,
});
}
in other post i see they set a selection of the filter when the page is load and recive a hash, i like to do the same but from a button. This is the other post UIkit 3's Filter component: Set active filter with URL hash - unable to change active filter with JS