NeoSketo
NeoSketo

Reputation: 525

How to get the scroll position of a kendo grid

I am trying to gather the scrollLeft/scrollTop position data from my kendo grid. So far i have this:

var mainGrid = $("#mainGrid").data("kendoGrid");
var testgrid = $("#mainGrid div.k-grid-content");
topoffset = testgrid.offset();

//which gives me these numbers but they do not look correct...
//left  44.959999084472656  Number
//top   174.55999755859375  Number

Then I want to demonstrate auto-positioning by forcing my grid to scroll to top: 0 and left: 0. Then back to the position I captured with this...

//send to top
testgrid.scrollTop(0);
testgrid.scrollLeft(0);

Grid doesn't scroll to top as expected.

//send to previous position
testgrid.scrollTop(topScroll);
testgrid.scrollLeft(leftScroll);

Grid doesn't scroll back to previous position.

It just doesn't seem like your allowed to force scroll to a position in kendo grid.

Upvotes: 0

Views: 6360

Answers (2)

Dilshad
Dilshad

Reputation: 1

You can use the following solution to get the scroll position of a Kendo grid:

$('html, body').animate({
 scrollTop: $("#unSubmittedGrid").offset().top-300
}, 'slow');

Upvotes: 0

Keith
Keith

Reputation: 4147

First off, you need to have this in your databound event. So if you want to have it set previously you can do:

databound: function(e){
  $('.k-grid-content').scrollTop('150');
    setTimeout(function () {
        $('.k-grid-content').animate({
            scrollTop: 0
        }, 1000);
    }, 2000);
    setTimeout(function () {
        $('.k-grid-content').animate({
            scrollTop: 200
        }, 1000);
    }, 5000);
});

And just switch out the values to what you want in speed an distance for the scroll ( I just used scrollTop but you can use variations ). If you want to play with the grid first and then capture where it is just use:

Then use a sessionStorage variable to save it and then enter it in your databound event. To capture the position of the grid before refresh you can do:

$(document).on('keydown', function(){
   $('.k-grid-content').scrollTop(); // capture how far from top
   $('.k-grid-content').scrollLeft(); // capture how far from left
});

This doesn't need to be in your databound event.

Upvotes: 3

Related Questions