Scroll to selected row in DataTables jQuery plugin

Question

I have a dataTable with infinite scrolling. I want to scroll to a selected row on table refresh

$('#table1').dataTable({
    'aaData': data,
    'aoColumns': columns,
    'bInfiniteScroll': true,
    'bColumnCollapse': true,
    'sScrollY': '200px'
});

$('#btnScroll').click(function(){
     $('.dataTables_scrollBody').scrollTo($('#table1 tbody tr').eq(3), 800);
});

But it does not scroll to the row

Mindaugas Večkys · Accepted Answer · 2014-07-14 09:29:51Z

2

You can use animate to scroll to your position

$('.dataTables_scrollBody').animate({
    scrollTop: $('#table1 tbody tr').eq(3).offset().top
}, 800)

DEMO

edited Jul 14, 2014 at 9:29

answered Jul 14, 2014 at 8:08

Mindaugas Večkys

4234 silver badges10 bronze badges

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

3 Comments

user544079 Over a year ago

Does not srcoll to the selected cell

Mindaugas Večkys Over a year ago

you're using scrollTo or scrollTop?

user544079 Over a year ago

But how can we scroll to say row 30, when the page shows only 20 rows at a time.

hrabinowitz · Accepted Answer · 2014-10-16 19:03:20Z

2

You are using the scrollTo plugin. Have you loaded it? You can write this without that plugin as follows:

var selectedRow = $('#table1 tbody tr').eq(3);
$('.dataTables_scrollBody').scrollTop(selectedRow.prop('offsetTop') - $('.dataTables_scrollBody').height()/2);

answered Oct 16, 2014 at 19:03

hrabinowitz

1,6502 gold badges14 silver badges13 bronze badges

Collectives™ on Stack Overflow

Scroll to selected row in DataTables jQuery plugin

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related