Show the new table rows after 1 min automatically using angular js

Question

I have a table with 100 rows of data which is displaying 10 rows at a time having pagination also. My question is, i want to show the another 10 rows without clicking on the pagination number. Like that it should be repeat continuously once it done again it come to first just same like the railway indicator which show the new trains / upcoming trains vice versa.

Guys if know the answer please help me, but don't mark as duplicate / irrelavant ...

Thanks in advance

 <table class="table table-striped responsive-utilities jambo_table bulk_action">
                <thead>
                  <tr class="headings">
                       <th class="column-title">S No</th>
                      <th class="column-title">Connection Number</th>
                    <th class="column-title">Received By</th>
                    <th class="column-title">Date</th>
                  </tr>
                </thead>
                <tbody >
                  <tr class="even pointer" dir-paginate="list in oporderlist| filter:search|orderBy:sortKey:reverse|itemsPerPage:10">
                      <td class=" " >{{$index+1}}</td>
                      <td class=" " >{{list.connectionno}}</td>
                      <td class=" " >{{list.receivedBy}}</td>
                      <td class=" " >{{list.createdAt|date:"dd/MM/yyyy"}}</td>
                  </tr>
                </tbody>
              </table>
                <dir-pagination-controls
   max-size="3"
   direction-links="true"
   boundary-links="true" style="float:right" >
</dir-pagination-controls>

Check out $interval. All you have to do it store the current page, and in the interval function add 1, and if it reaches the maximum pages, set it to 1 back again. — Ron Dadon
– Ron Dadon, Commented Jan 3, 2017 at 8:22

Nitin Agarwal · Accepted Answer · 2017-01-04 06:59:43Z

2

As you said the numPages is generated dynamically. Instead try this code which will resolve your problem. Here the code goes..

first calculate the length of the list

var len=$scope.oporderlist.length
later get the itemsperpage value

var pgsize=--itemsperpage_value--
var numpages1=$scope.oporderlist.length / pgsize
as % gives remainder and / gives quotient, get the numpages1 value with math.floor(numpages1) which will give you the exact pagination value.

var numpage=Math.ceil(numpages1)
now you can use this,

$scope.currentPage=($scope.currentPage % numPages)+1 // here assign $scope.currentPage=1 at top

So just mix up all this values and its done. More any query, happy to help you.

answered Jan 4, 2017 at 6:59

Nitin Agarwal

9411 gold badge13 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ANK Over a year ago

Thanks @Nitin Agarwal. It was woks great. Thanks Again

Fissio · Accepted Answer · 2017-01-03 08:28:41Z

2

Add a current-page attribute to your <tr> with the dir-paginate directive, and then call $interval from your controller code.

So in your HTML:

<tr class="even pointer" current-page="currentPage"
    dir-paginate="list in oporderlist| filter:search|orderBy:sortKey:reverse|itemsPerPage:10">

and in controller:

$scope.currentPage = 1;
var numPages = 10;

$interval(function() {
  $scope.currentPage = ($scope.currentPage % numPages) + 1;
}, 10000)

Plunker edited from the dir-paginate basic example: http://plnkr.co/edit/Q3NjpOehzXN9rNV9fsAh?p=preview

answered Jan 3, 2017 at 8:28

Fissio

3,75818 silver badges31 bronze badges

2 Comments

ANK Over a year ago

great... Thanks a lot @Fissio. But i dont know the value of numpages which we be generated based on no. of records in that list

Fissio Over a year ago

Then you'll need some extra logic inside the interval to determine if the next page has content to show :)

Collectives™ on Stack Overflow

Show the new table rows after 1 min automatically using angular js

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related