This is a migrated thread and some comments may be shown as answers.

How to scroll rotator to look like a radgrid

1 Answer 36 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
Jonathan
Top achievements
Rank 1
Jonathan asked on 07 Jun 2011, 02:48 AM
Hi,

I looked at this thread:

http://www.telerik.com/community/forums/aspnet-ajax/rotator/how-to-bind-radrotator-to-list-lt-t-gt.aspx

What I'd like to do is to create what looks like a scrollable radgrid reproducing the look of the embedded radgrid skins using tables and a radrotator.
 
My thought is to pick apart the output of a radgrid (view source) pull the css styles out of the skin files and then create a row template in the template of the rotator that matches the columns defined in the header row of the table for multiple attributes of a bound list.

My question is if I create a header row for the table outside of the rotator declaration and then define the row templates in the template of the radrotator will this mess up the table layout i.e will the table columns stay the same width?  could you provide a working example of this approach.  Also is there an alternating style on the radrotator to emulate the alternating row style on the radrid?

Thanks,

Jonathan



1 Answer, 1 is accepted

Sort by
0
Niko
Telerik team
answered on 07 Jun 2011, 09:04 AM
Hello Jonathan,

What you intend to accomplish does not appear a trivial task. Unfortunately we do not have such an example and implementing one from scratch would require a lot of time and resources. Still I will try to give you some guidelines to how such a setup could be accomplished.
  1. Create an empty Grid with the header only. It will stay on top of the rotator, thus simulating the header part. (Unfortunately you cannot incorporate rotator between rows of a table as that may break the DOM tree)
  2. Create the rotator just beneath the gird, making sure that they are perfectly aligned.
  3. Bind the data to the rotator and populate a table within the rotator. Please, make sure that the columns are again perfectly aligned to the header grid.
  4. The different items(pages) of the grid need to be controlled for your code as they are now referred to as rotator items, rather than as grid pages. Still creating a paging control will not be such a difficult task if you take advantage of the rotator's client-side API, especially the set_currentItemIndex method.

Hope this guidelines will help you in your implementation process.
Kind regards,
Niko
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Tags
Rotator
Asked by
Jonathan
Top achievements
Rank 1
Answers by
Niko
Telerik team
Share this question
or