Rendering Rollbase grids in mobile

Posted by Godfrey Sorita on 08-Jun-2017 11:35

Hi,

I would like to inquire how Rollbase is able to render Kendo grids properly on mobile devices. On mobile devices, grids(record list) are vertically responsive.

I created a custom grid using Kendo grid on a Rollbase script component. It is rendering properly but the view does not change on mobile devices even though mobile property is enabled.

You can view a simple example I made on this link. If you run and view the code on a simulator the grid is not adjusting the way Rollbase list view does.

Thanks,

Godfrey

Rollbase - Forum
Posted by Vimalkumar Selvaraj on 09-Jun-2017 00:45

Hi Godfrey,

In Mobile devices(both tablets & smartphones)  records list will be rendered as Cards by default, it is not Kendo Grid.. To render cards we use KendoMobileListView component. You can use our utility method to check device type and use different components accordingly 

rb.newui.util.isMobile() - return true if current device is tablet/smartphone.

Write your script to render KendoMobileListview if above method returns true otherwise renders kendoGrid. You can refer following documentation and demo links of kendoMobileListView component

http://docs.telerik.com/kendo-ui/api/javascript/mobile/ui/listview

Look for ListView section from below demo link

https://demos.telerik.com/kendo-ui/m/index#/

Please let us know if you need more details.

Thanks,

Vimal.

All Replies

Posted by Vimalkumar Selvaraj on 09-Jun-2017 00:45

Hi Godfrey,

In Mobile devices(both tablets & smartphones)  records list will be rendered as Cards by default, it is not Kendo Grid.. To render cards we use KendoMobileListView component. You can use our utility method to check device type and use different components accordingly 

rb.newui.util.isMobile() - return true if current device is tablet/smartphone.

Write your script to render KendoMobileListview if above method returns true otherwise renders kendoGrid. You can refer following documentation and demo links of kendoMobileListView component

http://docs.telerik.com/kendo-ui/api/javascript/mobile/ui/listview

Look for ListView section from below demo link

https://demos.telerik.com/kendo-ui/m/index#/

Please let us know if you need more details.

Thanks,

Vimal.

Posted by Godfrey Sorita on 09-Jun-2017 02:29

Thanks Vimal! It all makes sense now.

This thread is closed