Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Counter-Control not counting when unselecting Button Path Filter #310

Open
kon-foo opened this issue Jun 10, 2018 · 0 comments
Open

Counter-Control not counting when unselecting Button Path Filter #310

kon-foo opened this issue Jun 10, 2018 · 0 comments

Comments

@kon-foo
Copy link

kon-foo commented Jun 10, 2018

Not sure if it is a bug or me misusing jplist (awesome plugin btw!) but I want to use button path filters with a counter. Without a

<div data-control-type="button-filter-group"
       data-control-action="filter"></div>

element anywhere in the document, the ListFiltered event and hence the Counter is only triggered when selecting a filter, not when unselecting. With such an element the Counter works either ways. Uncomment the element in my example to reproduce:

<head>
    <script
			  src="https://code.jquery.com/jquery-3.3.1.min.js"
			  integrity_no="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
			  crossorigin="anonymous"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jplist/5.2.0/css/jplist.core.min.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jplist/5.2.0/js/jplist.core.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jplist/5.2.0/css/jplist.filter-toggle-bundle.min.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jplist/5.2.0/js/jplist.filter-toggle-bundle.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jplist/5.2.0/js/jplist.counter-control.min.js"></script>
</head>
<div id="demo">
   <div class="jplist-panel">
     <div data-control-type="button-filter-group"
       data-control-action="filter"></div>
      <button
         type="button"
         data-control-type="button-filter"
         data-control-action="filter"
         data-control-name="architecture-btn"
         data-path=".architecture"
         data-selected="true">
          <span id="architecture_counter"
            data-control-type="counter"
            data-control-action="counter"
            data-control-name="architecture_counter"
            data-format="({count})"
            data-path=".architecture"
            data-mode="filter"
            data-type="path"></span>
            Architecture
         </button>
      <button
         type="button"
         data-control-type="button-filter"
         data-control-action="filter"
         data-control-name="christmas-btn"
         data-path=".christmas">
         <span id="christmas_counter"
           data-control-type="counter"
           data-control-action="counter"
           data-control-name="christmas_counter"
           data-format="({count})"
           data-path=".christmas"
           data-mode="filter"
           data-type="path"></span>
            Christmas
         </button>
   </div>
   <div class="list">
      <div class="list-item">
         <div class="architecture">Architecture</div>
      </div>
      <div class="list-item">
        <div class="architecture christmas"> Architecture and Christmans</div>
      </div>
      <div class="list-item">
         <div class="christmas">Christmans</div>
      </div>
   </div>
   <div class="jplist-no-results">
      <p>No results found</p>
   </div>
</div>
<script type="text/javascript">
$('document').ready(function(){
  $('#demo').jplist({
    itemsBox: '.list'
    ,itemPath: '.list-item'
    ,panelPath: '.jplist-panel'
    });
  var api = $('#demo').data('jplist'),events = api.observer.events;
  api.observer.on(events.listFiltered, function(){
    console.log('list filtered');
    });
});

</script>

For me at least this is very unexpected behaviour. cheers
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@kon-foo