PDA

View Full Version : Synchronizing horizontal scroll event of two grids.



webfriend13
31 May 2012, 2:17 AM
Hi All,

I am using ExtJS 4.1. I have two grids. These grids are placed one over another. One grid shows the data and second grid have only one row (which acts as footer row). I am hiding the horizontal scroll bar of the data grid (first grid) so that user sees only one horizontal scroll bar just below the footer grid. I am using following config options to hide the horizontal scrollbar.

autoScroll: false,
scroll: 'vertical',

I want to synchronize the horizontal scroll bar event so that when user uses horizontal scroll bar, both the grids should move left - right or right to left.

I referred to some of the links available online but not able to come up with perfect solution. Some of these links are not compatible with ExtJs 4.1

http://www.sencha.com/forum/showthread.php?139084-Extjs-4-grid.getView().on(-bodyscroll-function(event-target)

http://davehiren.blogspot.com/2011/11/synchronize-extjs-grid-vertical.html


Please provide your suggestions and solutions.

mitchellsimoens
7 Jun 2012, 12:39 PM
You can listen for scroll events on the element that is scrolling and then scroll the other grid.