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: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

hideAtMedia behaves unexpectedly

Thread ID:

Created:

Updated:

Platform:

Replies:

150858 Jan 22,2020 07:36 AM UTC Jan 31,2020 01:21 PM UTC Vue 3
loading
Tags: Data Grid
Bob
Asked On January 22, 2020 07:37 AM UTC

Hello,

I am trying to get hideAtMedia working for my vue solution (4.1.2) trying to make the grid more responsive.
As stated in the dox, columns should be made visible/invisible by using a media query.
Although this works on first load, this does not seem to work if the browser window is resized after the initial load; i.e. when I load it maximized all columns are visible (that is correct), but when I downsize the browser window without reloading the page, the columns are still visible.
This is a problem as users can, for instance, rotate their tablet at any time to get more vertical screen room.

Is this by design?
How can I get it to re-evaluate?

This is my .vue page:

<template>
  <ejs-grid id="gen2Grid" ref="gen2Grid" :dataSource="data>
    <e-columns>
      <e-column field="mt" headerText="Material">e-column>
      <e-column field="mst" headerText="Service" hideAtMedia="(min-width: 800px)">e-column>
    e-columns>
  ejs-grid>
template>

<script lang="ts">
import { ComponentVue } from 'vue-property-decorator';
import { GridPlugin } from '@syncfusion/ej2-vue-grids';

@Component
export default class GenWorklistComponent extends Vue {
  public dataany = [
    {
      mt: '2445/01, BAVARIA, FASH X-SB 6-25',
      mst: 'Jaarlijks onderhoud',
    },
    {
      mt: '2445/01, BAVARIA, FASH X-SB 6-25 met extra vulling',
      mst: 'Jaarlijks onderhoud',
    },
  ];

}
script>

<style scoped lang="scss">
@import '../../node_modules/@syncfusion/ej2-vue-grids/styles/material.css';
style>

Dhivya Rajendran [Syncfusion]
Replied On January 27, 2020 10:21 AM UTC

Hi Bob, 

Thanks for contacting Syncfusion support. 

We have checked the reported problem in the Intel Atom Z3770 tablet and it is working fine at our end. Please share the below details,  which will help us to validate further at our end and to provide a better solution as soon as possible. 

  1. Share the device details and browser details
  2. The reported problem occurred in any particular device/bowser or all devices?
  3. Share screenshot of the problem
  4. Syncfusion package version details

Regards, 
R.Dhivya 


Bob
Replied On January 29, 2020 09:31 AM UTC

Hi, thank you for your answer.

I tried this on a PC actually using Windows 10 10.0.18362, Chrome 79.0.3945.130 and FireFox 72.0.1 (64-bits), Syncfusion version 17.4.43 (ej2-vue-grids).
I haven't tried this on a mobile device yet as debugging options for those devices are limited and ofc it should work on a PC as well.

Resizing the browser window after page load does not change column visibility.
It feels like the media query is only being evaluated on page load.
When reloading the content in the resized window (just hit F5), the column *is* hidden, per the mediaquery.
I have added 3 screenshots (in order) to illustrate the problem.

Thanks,
Bob


Attachment: 20200129__synfusion_support_e01f3076.zip

Dhivya Rajendran [Syncfusion]
Replied On January 31, 2020 01:21 PM UTC

Hi Bob, 

Thanks for sharing the details. 

We are able to reproduce the reported issue at our end. We have logged a bug report for the reported issue as “media query (hideAtMedia) is not working properly”. Thank you for taking  time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our upcoming February 12 Patch Release. 
 
Until then we appreciate your patience. 
 
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  
  

Regards, 
R.Dhivya 


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.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

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

Live Chat Icon For mobile
Live Chat Icon