CODEWITHSUNDEEP
javascriptlistpaginationlist.js
Hola
Hola

Reputation: 125

How to hide list.js.pagination if pages == 1?

I use https://github.com/javve/list.js and plugin for pagination https://github.com/javve/list.pagination.js

Just want to hide pagination if only one page. Whats the best way to do it?

I tried:

    var paging = document.getElementById('paging');

    if (pages.length <= 1) {
        paging.style.display = 'none';
    }

Doesn't works.

Here is an example: http://codepen.io/anon/pen/RoVMYb

Pages var https://github.com/javve/list.pagination.js/blob/master/dist/list.pagination.js#L451

Upvotes: 0

Views: 2248

Answers (3)

Kishore Kumar
Kishore Kumar

Reputation: 12864

Please check my modified snippet. To see the pagination, set page: 5 below

var monkeyList = new List('test-list', {
  valueNames: ['name'],
  page: 15,
  outerWindow:0,
  plugins: [ ListPagination({}) ] 
});

if((monkeyList.size()/monkeyList.page)<=1){
  document.getElementsByClassName('pagination')[0].style.display = 'none';
}
.pagination li {
  display:inline-block;
  padding:5px;
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>  
<script src="http://listjs.com/assets/javascripts/list.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/list.pagination.js/0.1.1/list.pagination.min.js"></script>
  
  <div id="test-list">
    <input type="text" class="search" />
    <ul class="list">
      <li><p class="name">Guybrush Threepwood</p></li>
      <li><p class="name">Elaine Marley</p></li>
      <li><p class="name">LeChuck</p></li>
      <li><p class="name">Stan</p></li>
      <li><p class="name">Voodoo Lady</p></li>
      <li><p class="name">Herman Toothrot</p></li>
      <li><p class="name">Meathook</p></li>
      <li><p class="name">Carla</p></li>
      <li><p class="name">Otis</p></li>
      <li><p class="name">Rapp Scallion</p></li>
      <li><p class="name">Rum Rogers Sr.</p></li>
      <li><p class="name">Men of Low Moral Fiber</p></li>
      <li><p class="name">Murray</p></li>
      <li><p class="name">Cannibals</p></li>
    </ul>
    <ul class="pagination"></ul>
  </div>

Upvotes: 1

Gray Fox
Gray Fox

Reputation: 357

Without full code it's hard to say, but I presume that you have some variable that holds number of pages, maybe it's even 'pages'. If so, then the answer is:

if (pages <= 1) {
    paging.style.display = 'none';
}

Upvotes: 0

Liberateur
Liberateur

Reputation: 1487

getElementById have no length parameter, id is unique. Try this :

var paging = document.getElementById('paging');

if (paging) {
    paging.style.display = 'none';
}

Upvotes: 0

Related Questions