ListView and Side Panel

[Joel]

I want to create a view with a layout similar to Outlook or the Team Efficiency page of the Telerik Northwind Dashboard sample app.  There will be a ListView of names on the left.  When you click on a name, more information about the person will appear in a side panel to the right.  So far, so good.  On phones and other ​small screens, I need this ​view to function as Outlook does on those devices.  Only the ListView should be visible until you click on a name, ​at which time the side panel will be displayed and the ListView will no longer be visible. That's where I need some help.

What's the best way to go about this using Telerik controls? I am using Bootstrap to control the layout, but this is a little different since it is not based just on the size of the screen.

Thanks,

Joel

[Georgi Krustev]

Hello Joel,

I would suggest you check our widgets and most specifically the:

• Splitter - this will help you to layout the page
• ListView - render the right part
• TreeView - render the left part (you can use ListView here too)

Basically, those widgets will be sufficient to accomplish your goal. You can check our Responsive Web Design page that will shed more light what you will need to do in order to make a responsive page with our widgets.

Regards,
Georgi Krustev
Telerik