ejGrid - scrolling on mobile device

[Saquib Nisar]

I have rendered a adaptive grid on a mobile device.

However, the touch input seems to be disabled so I cannot scroll up and down the grid. I can scroll around the remainder of my site, but the grid portion is completely unresponsive.

Hopefully it's just some setting I'm missing when initialising the grid that is causing this ?

Thanks,

Saquib

[Ragavee U S]

Hi Saquib,

Thanks for your interest in Syncfusion products.

We have analyzed the reported query and we suggest you to ensure the below cases in your sample project.

1.       If you have referred individual script files in your project, we suggest you to include the ej.touch.min.js file also to your project.

2.       Also, check whether the enableTouch property of the grid is enabled or not. Please refer the below link for more information on the enableTouch property

API Reference Link: http://helpjs.syncfusion.com/js/api/ejgrid#members:enabletouch

3.       Ensure whether you have enabled scrolling for your grid and have referred the responsive scripts or not . Please refer the below online documentation link for enabling scrolling in grid.

Online Documentation Link: http://helpjs.syncfusion.com/js/grid/scrolling

The necessary scripts to be referred for responsive functionality of the grid are ej.responsive.css and ejgrid.responsive.css. The files are to be referred in the order mentioned as in the below table.

<link rel='nofollow' href="themes/default-theme/ej.widgets.all.min.css" rel="stylesheet" />   

    <link rel='nofollow' href="themes/responsive-css/ej.responsive.css" rel="stylesheet" />

       <link rel='nofollow' href="themes/responsive-css/ejgrid.responsive.css" rel="stylesheet" />

    <script src="scripts/jquery-1.10.2.min.js"></script>

    <script src="scripts/jquery.easing.1.3.min.js"></script>

    <script src="scripts/jquery.globalize.min.js"></script>

    <script src="scripts/jsondata.js"></script>

    <script src="scripts/jsrender.min.js"></script>
    <script src="scripts/ej.web.all.min.js" type="text/javascript"></script>

4.       Also, ensure whether isResponsive and enableResponsiveRow properties have been set in the sample. Please refer the below API reference link for more information on the properties.

http://helpjs.syncfusion.com/js/api/ejgrid#members:enableresponsiverow

http://helpjs.syncfusion.com/js/api/ejgrid#members:isresponsive

For your convenience, we have created a sample and the same can be downloaded from the following location.

Sample Link: http://www.syncfusion.com/downloads/support/forum/119738/ze/Sample674243505

Please try the above sample and still if you face any difficulties, please share the below details with us.

1.       Your mobile device details in which the issue occurs.
2.       Browser version details.
3.       If possible, please share your grid rendering code.


The provided details will be helpful for us to assist you accordingly.

Please get back to us if you need any further assistance.

Regards
Ragavee U S

---

SN Saquib Nisar July 28, 2015 02:22 PM UTC

Thanks Ragavee.

I'm finding that if the whole grid is not visible, i.e. some of the rows are off the bottom of the screen, even with your example you cannot scroll to the bottom. Try doing this in the Chrome desktop browser, by resizing the screen.

---

SN Saquib Nisar July 28, 2015 02:24 PM UTC

Example image here;

http://postimg.org/image/3ld2f6bdr/

---

SN Saquib Nisar July 29, 2015 09:50 AM UTC

I think it might help if I clarify what I am looking for, so an appropriate example may be provided ?

1 - In 'normal' desktop mode, I wish the grid to take up all the available space within its container, so if the container is 1000px wide, the grid should be this width. If the page is resized and container is now 900px, the grid should be resized to fit within. My grid width does not change when I change to size of the screen (note I'm using bootstrap for styling)

2 - The column widths should be set according to the size of data, and resize automatically when the grid size changes

3 - In 'mobile' mode, I want the responsive row to appear

4 - On a tablet or landscape mode on a mobile, the grid should allow scrolling to view additional columns/rows. I'm finding the swipes to bring more columns into view are actually changing page (or not working at all).

Hopefully the above makes sense ?

---

SA Saravanan Arunachalam Syncfusion Team July 30, 2015 11:27 AM UTC

Hi Saquip Nisar,

Thanks for the update.

We have analyzed the reported query in incident #142046. And also we have provided the response for your query in that incident and hence please refer the incident #142046 for better follow up.
 
Please let us know if you have any queries.

Regards,
Saravanan.A

---

SN Saquib Nisar July 30, 2015 12:14 PM UTC

Can't access that incident ? Only have #142089 and #142088 on my account.

---

SN Saquib Nisar August 3, 2015 10:04 AM UTC

This is all very confusing!

1 - can you remove my email address from public view, don't appreciate that being shared on a public forum.

2 - can you use my current account to add/update any issues, not the old email address, as I don't have access to that any more ?

Thanks.

---

KK K Kalai Selvi Syncfusion Team August 4, 2015 06:57 AM UTC

Hi Saquip Nisar,
 
Sorry about the inconvenience caused.
 
We have removed your email address from our public forum and will use your currect account to add/ update any issues further.
 
Regards,
Kalaiselvi

---

VT Vinh Tran November 5, 2015 09:58 AM UTC

Hi Saquib, Saravanan,

I have exactly the same issue viewing the page with grid in mobile. Have you got any clue to fix this issue?

Thanks,

Vinh

---

RU Ragavee U S Syncfusion Team November 6, 2015 06:20 AM UTC

Hi Vinh,

In this forum, we have already updated the essentials for rendering a responsive grid. Please refer to it for rendering the responsive grid. We have also updated a sample in this forum in the update corresponding to  28/7/2015.

Please try the sample and if you still face difficulties, please share the below details

1.       By “same issue”, could you please explain what issue that you are referring to?

2.       Replication procedure and screenshot of the issue.

3.       Could you please tell us if you are resizing the height of the browser and expecting the grid responsiveness in height?

4.       If possible, please reproduce the issue in the sample provided in this forum.

Regards,
Ragavee U S.

SIGN IN To post a reply.

• 10 Replies
• 5 Participants
• Want to subscribe?
  SIGN IN
• Created by
  SN Saquib Nisar
• Platform
  jQuery
• Control
  ejGrid
• Created On
  Jul 27, 2015 03:09 PM UTC
• Last Activity On
  Nov 6, 2015 06:20 AM UTC

[Saquib Nisar]

Thanks Ragavee.

I'm finding that if the whole grid is not visible, i.e. some of the rows are off the bottom of the screen, even with your example you cannot scroll to the bottom. Try doing this in the Chrome desktop browser, by resizing the screen.

[Saquib Nisar]

Example image here;

http://postimg.org/image/3ld2f6bdr/

[Saquib Nisar]

I think it might help if I clarify what I am looking for, so an appropriate example may be provided ?

1 - In 'normal' desktop mode, I wish the grid to take up all the available space within its container, so if the container is 1000px wide, the grid should be this width. If the page is resized and container is now 900px, the grid should be resized to fit within. My grid width does not change when I change to size of the screen (note I'm using bootstrap for styling)

2 - The column widths should be set according to the size of data, and resize automatically when the grid size changes

3 - In 'mobile' mode, I want the responsive row to appear

4 - On a tablet or landscape mode on a mobile, the grid should allow scrolling to view additional columns/rows. I'm finding the swipes to bring more columns into view are actually changing page (or not working at all).

Hopefully the above makes sense ?

[Saravanan Arunachalam]

Hi Saquip Nisar,

Thanks for the update.

We have analyzed the reported query in incident #142046. And also we have provided the response for your query in that incident and hence please refer the incident #142046 for better follow up.
 
Please let us know if you have any queries.

Regards,
Saravanan.A

[Saquib Nisar]

Can't access that incident ? Only have #142089 and #142088 on my account.

[Saquib Nisar]

This is all very confusing!

1 - can you remove my email address from public view, don't appreciate that being shared on a public forum.

2 - can you use my current account to add/update any issues, not the old email address, as I don't have access to that any more ?

Thanks.

[K Kalai Selvi]

Hi Saquip Nisar,
 
Sorry about the inconvenience caused.
 
We have removed your email address from our public forum and will use your currect account to add/ update any issues further.
 
Regards,
Kalaiselvi

[Vinh Tran]

Hi Saquib, Saravanan,

I have exactly the same issue viewing the page with grid in mobile. Have you got any clue to fix this issue?

Thanks,

Vinh

[Ragavee U S]

Hi Vinh,

In this forum, we have already updated the essentials for rendering a responsive grid. Please refer to it for rendering the responsive grid. We have also updated a sample in this forum in the update corresponding to  28/7/2015.

Please try the sample and if you still face difficulties, please share the below details

1.       By “same issue”, could you please explain what issue that you are referring to?

2.       Replication procedure and screenshot of the issue.

3.       Could you please tell us if you are resizing the height of the browser and expecting the grid responsiveness in height?

4.       If possible, please reproduce the issue in the sample provided in this forum.

Regards,
Ragavee U S.

SIGN IN To post a reply.