I am using Infragistics grid with Spliiter view.as shown in below screenshot.
Here we are having issue that when we click on splitter , the infragistics grid becomes irresponsive but when we change screen size to Ipad , grid layout becomes responsive to single column template view.
so we want when user clicks on splitter , the grid should become to single column template.as shown in image "Expected result "
So we think grid becomes responsive when we change window size , but not when div size changes.so we want when user chages div , the grid should become responsive to single column.
For reference , for single column template
and for spliter:
1) 1st View
Code of Single column template view
2) @nd View
Code of splitter.
Thank you for contacting us.
When you say you change the screen to iPad do you mean you emulate it using a browser or you have an iPad mode?
The described scenario occurs because the grid becomes responsive based on the window size, not the container size. Please take a look at this help topic - http://www.igniteui.com/help/iggrid-responsive-web-design-mode-overview. If you want to have a grid responsive based on the container, you have to create a custom RWD profile - http://www.igniteui.com/help/iggrid-responsive-web-design-mode-creating-custom-profile. It would look something like this:
where the container has an id "test".
Please let me know if you need further assistance.
Best Regards, Tihomir IlievSoftware DeveloperInfragistics, Inc.
Thanks for your reply.
We have tried you solution in our code but it didn't work..
So can you please check our code by downloading from this url: http://web1.anasource.com/xfer/Demo%20App%20Infra.zip
In code,we have created two demos with combination of grid and splitter
For splitter, we have used this link : http://www.igniteui.com/splitter/overview
Demo 1 : Grid > Responsive Web Design Mode with Splitter ( Using Asp.net mvc helper )
For Grid > Responsive Web Design Mode, we have used this link : http://www.igniteui.com/grid/responsive-web-design-mode
Refer below files for Demo 1:
Demo1.cshtmlDemoController.cs -> "Demo1" Method_Layout.cshtml -> for loading css and jqueries
Demo 2: Single column template grid with Splitter ( Using jquery)
For single column template grid, we have used this link : http://www.igniteui.com/grid/responsive-single-column-template
Refer below files for Demo 2:
Demo2.cshtmlDemoController.cs -> "Demo2" and "GetGridData" Method_Layout.cshtml -> for loading css and jqueriesCan you please check in our demo code and implement necessary changes in our demo to produce the desired output ?
I will check your application and get back to you as soon as possible.
I updated Demo2.cshtml file and I am sending it to you.
Please let me know if you have further questions.