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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Grid scroll width and height settings change after perform filtering

Thread ID:

Created:

Updated:

Platform:

Replies:

125286 Aug 5,2016 05:08 AM UTC Aug 10,2016 12:18 PM UTC ASP.NET Web Forms 3
loading
Tags: Grid
Taweesak Upala
Asked On August 5, 2016 05:08 AM UTC

I have a grid with filtering and scrolling enabled as below

<ej:Grid ID="grdVendor" runat="server" IsResponsive="true" EnableResponsiveRow="true"
          GridLines="None" 
          AllowScrolling="true" 
          AllowResizing="True" 
          AllowTextWrap="false"
          AllowSorting="true" 
          AllowFiltering="true"
          EnableHeaderHover="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" />
           <Columns>
                     <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>
            </Columns>
</ej:Grid>


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 :(

Prasanna Kumar Viswanathan [Syncfusion]
Replied On 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. 
 
 
Regards, 
Prasanna Kumar N.S.V 


Taweesak Upala
Replied On 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 14.2.0.26 
- Video demo of the issue was attached.

Regards,
Taweesak Upala


Attachment: Video_901d4470.zip

Prasanna Kumar Viswanathan [Syncfusion]
Replied On 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.  
 
 
Regards, 
Prasanna Kumar N.S.V 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;