1. Home
  2. Forum
  3. React - EJ 2
  4. Frozen Columns and Horizontal Scrolling

Frozen Columns and Horizontal Scrolling

Hi,

I am using React Syncfusion Grid for my project. In my grid I have frozen the right most Column with the help of FrozenColumns.

While doing this I am able to horizontally scroll through my grid with the scroll bar present at the bottom, but I am not able to scroll horizontally using the touchpad of my laptop.

Sample Implementation

columns=[

{field:"aaaaaa",headertext:"aaaa",template:customColumnTemplate},{field:"bbbbbb",headertext:"aaaa",template:customColumnTemplate}

{field:"ccccccc",headertext:"aaaa",template:customColumnTemplate,freeze:"Right"}

]

return

<GridComponent 

frozenColumns={1}


/>


<Inject services={[Freeze]}

<GridComponent>


3 Replies
MS Manivel Sellamuthu Syncfusion Team July 13, 2021 11:02 AM UTC

Hi ym, 
 
Greetings from Syncfusion support. 
 
We have checked the reported query at our end and the horizontal scrollbars working fine on our end. Please find the below demo and video reference for more information. 
 
 
 
To validate further on the reported case, share the below details, which will be helpful for us to validate further. 
 
  1. In above given demo and ensure whether you are able to scroll the content using touch pad or not
  2. If you have not faced the issue in above demo, we suggest you to update the Syncfusion packages to the latest version in your application
  3. Please share if you  have used any custom CSS for customizing grid scroller
  4. Please share the system specifications (we have checked this in Windows 10 Chrome 91.x )
 
Regards, 
Manivel 


YM ym July 13, 2021 09:08 PM UTC

Hi, Thank you for your response

1.Yes, I am able to scroll the content using my touch-pad in the demo you provided.

2.The Syncfusion-Grid version of My project is-19.1.66.

3.No, I have not used any custom CSS for my grid scroller.

4.Yes, I am using the latest version of Chrome on my system.

I am able to use the scroll horizontally with the scroll bar, but not with my touch pad, I even Tried freezing the left side of my table, Touch pad scroll is not functioning like this too. I even tried using column Directives without using custom columns, I got the same result with this approach too. 



columns=[

{field:"aaaaaa",headertext:"aaaa",template:customColumnTemplate},{field:"bbbbbb",headertext:"aaaa",template:customColumnTemplate}

{field:"ccccccc",headertext:"aaaa",template:customColumnTemplate,freeze:"Right"}

]

return

<GridComponent 



/>


<Inject services={[Freeze]}

<GridComponent>

Thank you

ym


MS Manivel Sellamuthu Syncfusion Team July 14, 2021 08:32 AM UTC

Hi ym, 

Thanks sharing the requested details. 

From your confirmation we suspect that using the lower version of the Syncfusion packages is the cause of the issue. Because the scroller is working fine in our shared demo and you have not made any customization for grid scroller. So we suggest you to update the Syncfusion packages to our latest version (19.2.47 as of now) and ensure the reported issue is resolve or not. 


If you still faced the issue, please the below details to proceed further 

  1. Share the complete Grid code
  2. Please try to replicate the reported issue in our given sample
  3. Please share the issue reproducible sample , if possible
  4. Share the video demonstration of the issue

Regards, 
Manivel 


Loader.
Up arrow icon