Button RadRotator

8 posts, 0 answers
  1. Christopher Susilraj
    Christopher Susilraj avatar
    10 posts
    Member since:
    Oct 2008

    Posted 07 Sep 2011 Link to this post

    Hi sir,
              We are using  button type radrotator sir....

    Our need is images are showing in rad rotator by two rows sir...Normally It shows image single row only...

    I have attach my screenshot file sir....

    Please kindly check it and say how to use rotator in two rows nu sir....
     
    I am waiting for your valuable answer sir.

    Regards
    Balaji.J
  2. Niko
    Admin
    Niko avatar
    387 posts

    Posted 08 Sep 2011 Link to this post

    Hi,

    Your best option is to create the rotator so that a single rotator item will consist of two images one on top of the other. The group of items will be rotated together.
    Please, check the attached sample page for a sample implementation.

    Greetings,
    Niko
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Christopher Susilraj
    Christopher Susilraj avatar
    10 posts
    Member since:
    Oct 2008

    Posted 09 Sep 2011 Link to this post

    Thanks for your kindly reply

    But we are using the Single image column in table with Unique Id sir....
    In your   sample code  the same image Name with same ID  displayed in two rows of Rotator sir....

    In our project each images having Unique ID values sir....

    The below Telerik Rotator attributes used in our project sir...

    <telerik:RadRotator ID="radRotator" runat="server" Width="260px" Height="58px" ItemHeight="110px" WrapFrames="false"
                                                RotatorType="Buttons" OnItemClick="LinkButton1_Click" ItemWidth="100px"    Style="margin-left: 0px">
                                                 <ItemTemplate>
                                                    <div style=" margin-top: 0px;">
                                                        <img src='<%# Eval("image") %>' title='<%# Eval("SolutionManager") %>' style="cursor: pointer" />
                                                    </div>
                                                    <asp:HiddenField ID="RespondentId" runat="server" Value='<%# Eval("RespondentId") %>' />
                                                    <asp:HiddenField ID="SolutionManager" runat="server" Value='<%# Eval("SolutionManager") %>' />
                                                </ItemTemplate>                                                
                                            </telerik:RadRotator>

    I have also attached  Table Screenshot also sir.....

    Our need is display images with unique Id values  in double rows of Radrotator sir...

    Please kindly reply for my issue sir.....I am waiting for your valuable answer......


    Regards
    Balaji.J
  5. Niko
    Admin
    Niko avatar
    387 posts

    Posted 12 Sep 2011 Link to this post

    Hi Balaji,

    If that is the case, then you may wish to split the respondents in two different rotators, one above the other and thus they will look like one and the same rotator, but the different items will contain one image only. 
    You may end up with the following implementation:
    dRotator InitialItemIndex="4" ID="rotatorRow1" runat="server" Width="900" ItemWidth="300" Height="220" ItemHeight="220" FrameDuration="1" RotatorType="AutomaticAdvance" ScrollDuration="3000" PauseOnMouseOver="false">
        <ItemTemplate>
            <asp:Image ID="Image1" runat="server" SlideID='<%# Eval("id") %>' ImageUrl='<%# Eval("image") %>' AlternateText='<%# VirtualPathUtility.GetFileName(Eval("image").ToString()) %>' />
        </ItemTemplate>
    </telerik:RadRotator>
    <telerik:RadRotator InitialItemIndex="4" ID="rotatorRow2" runat="server" Width="900" ItemWidth="300" Height="220" ItemHeight="220" FrameDuration="1" RotatorType="AutomaticAdvance" ScrollDuration="3000" PauseOnMouseOver="false">
        <ItemTemplate>
            <asp:Image ID="Image1" runat="server" SlideID='<%# Eval("id") %>' ImageUrl='<%# Eval("image") %>' AlternateText='<%# VirtualPathUtility.GetFileName(Eval("image").ToString()) %>' />
        </ItemTemplate>
    </telerik:Rad


    Hope this helps.

    Greetings,
    Niko
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Christopher Susilraj
    Christopher Susilraj avatar
    10 posts
    Member since:
    Oct 2008

    Posted 13 Sep 2011 Link to this post

    Thanks sir,
                        Please explain with sample code for that two rotators how to store image with correspond Respondent values...

    Please kindly send sample code sir.......


    Regards
    Balaji.J
  7. Niko
    Admin
    Niko avatar
    387 posts

    Posted 13 Sep 2011 Link to this post

    Hello Balaji,

    Please, find attached the sample implementation that I was created, resembling your use case.

    All the best,
    Niko
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. Christopher Susilraj
    Christopher Susilraj avatar
    10 posts
    Member since:
    Oct 2008

    Posted 14 Sep 2011 Link to this post

    Thanks sir,
                       I saw your sample code sir, In your code your are using same images with same id values for tworotators sir,
    But our need is each row showing different images  with unique Id value sir....

    please kindly explain with sample code using different images in two rotators sir




    Regards
    Balaji.J
  9. Niko
    Admin
    Niko avatar
    387 posts

    Posted 14 Sep 2011 Link to this post

    Hello Balaji,

    The data source provided to the Rotator is of minor importance for this example. You can simply change the values in the code-behind file and thus you will get different images. All you need to do in your application scenario is divide the data that you have collected in two IEnumerable collections and supply them to the rotator. Here is a sample with different ids and different images:
    rotatorRow1.DataSource = new[] {
        new { image = "~/content/motorcycles/1.png", id = 1 },
        new { image = "~/content/motorcycles/2.png", id = 2 },
        new { image = "~/content/motorcycles/3.png", id = 3 },
        new { image = "~/content/motorcycles/4.png", id = 4 }
    };
    rotatorRow2.DataSource = new[] {
        new { image = "~/content/motorcycles/5.png", id = 5 },
        new { image = "~/content/motorcycles/6.png", id = 6 },
        new { image = "~/content/motorcycles/7.png", id = 7 },
        new { image = "~/content/motorcycles/8.png", id = 8 }
    };

    Hope this helps.

    All the best,
    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
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017