We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Grid scroll width and height settings change after perform filtering

I have a grid with filtering and scrolling enabled as below

<ej:Grid ID="grdVendor" runat="server" IsResponsive="true" EnableResponsiveRow="true"
          <FilterSettings FilterType="Excel"></FilterSettings>
          <EditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" AllowEditOnDblClick="false" ShowDeleteConfirmDialog="true" EditMode="InlineForm" />
          <ToolbarSettings ShowToolbar="True" ToolbarItems="add,edit,delete,update,cancel,excelExport,wordExport,pdfExport"></ToolbarSettings>
          <ScrollSettings Height="450" Width="100%" EnableTouchScroll="true" ScrollerSize="20"></ScrollSettings>
          <ClientSideEvents QueryCellInfo="OnQueryCellInfo" EndAdd="endAdd" EndEdit="endEdit" EndDelete="endDelete"  ActionComplete="complete" />
                     <ej:Column Field="No" HeaderText="No." HeaderTooltip="No." IsPrimaryKey="true" Width="120"></ej:Column>
                     <ej:Column Field="Name" HeaderText="Name" HeaderTooltip="Name" Width="250"></ej:Column>
                     <ej:Column Field="Search_Name" HeaderText="Search Name" HeaderTooltip="Search Name" Width="220"></ej:Column>
                     <ej:Column Field="Address" HeaderText="Address" HeaderTooltip="Address" Width="250"></ej:Column>
                     <ej:Column Field="Address" HeaderText="Address 2" HeaderTooltip="Address 2" Width="250"></ej:Column>
                     <ej:Column Field="Phone_No" HeaderText="Phone No." HeaderTooltip="Phone No." Width="100"></ej:Column>
                     <ej:Column Field="Fax_No" HeaderText="Fax No." HeaderTooltip="Fax No." Width="100"></ej:Column>
                     <ej:Column Field="Balance_LCY" HeaderText="Balance (LCY)" HeaderTooltip="Balance (LCY)" Width="150" TextAlign="Right" DataType="Decimal" Format="{0:n2}" AllowEditing="false"></ej:Column>

First time the data was loaded, the scroll width and height fine 

After perform filtering

Even if I clear all filter, the scroll width and height still the same

Please help :(

3 Replies

PK Prasanna Kumar Viswanathan Syncfusion Team August 8, 2016 10:45 AM UTC

Hi Upala, 

Thanks for contacting Syncfusion support. 

In our sample we checked with your code example the scroll width and height is different after we clear the filter. 

Find the screenshots: 

First time the data was loaded : 


After perform filtering: 


After clearing the filter : 


In your code example we found that you have enable isResponsive property. To make the grid responsive, we have to include the minwidth property in your sample. The minwidth property  is used to set the minimum width of the responsive grid. If the grid is less than the minwidth then the scrollbar will be displayed to maintain the minimum width. We suspect that it may be the root cause of the issue. So, please include the minwidth property in your sample. 
In your code example we also found that you have enable EnableResponsiveRow property. This property is used to view the grid in Mobile Layout. So, did you face the issue when the grid render in mobile view?. 
After include the minwidth property, if you still face the same issue please provide the following details. 
1. In this update we unable to view your screenshots. Can you please re-attach your screenshots? 
2. Essential Studio Version. 
3. If Possible, reproduce the issue in the attached sample. 
4. Video demo of the issue. 
Prasanna Kumar N.S.V 

TU Taweesak Upala August 9, 2016 04:13 AM UTC

Hi Kumar,

The "MinWidth" property fixed my scroll size issue as you mentioned. But, I have another filtering issue when I view the web page in mobile device. Every time I perform filter (or clear filter) on any column, all data row and horizontal scroll bar disappeared. And I found that if I click on column header (perform sorting), everything comes back. Otherwise, It works fine on desktop browser.

- My Essential Studio Version is 
- Video demo of the issue was attached.

Taweesak Upala

Attachment: Video_901d4470.zip

PK Prasanna Kumar Viswanathan Syncfusion Team August 10, 2016 12:18 PM UTC

Hi Upala, 

We can reproduce the mentioned issue in our sample. A support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.  
Prasanna Kumar N.S.V 

Live Chat Icon For mobile
Up arrow icon