Sliding Multiple Itemplates

[Sufyan]

Hi, 
I am using rad rotator and have 7 item templates with a single image in every itemtemplate... When it rotates the image will scroll one by one.. working fine .. 
Now I have an scenario I have numeric buttons outside the rotator like with caption 1 2 3 4 5 6 7... I want to achieve that if the rotator is on image 3 just suppose and user click button with caption 7 then the rotator should rotate 4 images (4 images visibly slide) and stops at image 7... 


Can you help me how can I achieve this through Client Side API function, any routine or function .. 

Thanks in Advance .. 

[Sufyan]

Hello any one there .. please help regarding above discussed issue ... 

[Niko]

Hello Sufyan,

The most important method that you need to use in your implementation is the showNext rotator method. It takes as a first parameter the direction in which to rotate. Here is a link to the help article on the topic - http://www.telerik.com/help/aspnet-ajax/rotator-client-side-api.html.
Still there is one very tricky part when trying to iterate among the items with showNext - in order to work correctly you should wait for the previous rotation to complete. For that you should attach to the OnClientItemShown method in case it is necessary call the showNext method again.
Please, find attached a sample page with the above described implementation.

Hope this helps.

All the best,
Niko
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Sufyan]

Hello Niko,

Thank you for your reply. I have tried the solution you provided but it works fine for 3 objects. When I add 4 or 5th object It did not slide 3 or 4 images. 
Do I add something to make it work or any help ?


Thank you in Advance

Sufyan 

[Niko]

Hello Sufyan,

Yes, I now noticed this behavior. In that case we will need to change the strategy. As the result should be a very much customized management of the rotator, then the better option is to change the RotatorType to FromCode. After that all manipulations on the rotator should happen through a custom code. Please, find attached a sample implementation with the changed approach.

Hope this helps.

Regards,
Niko
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Sufyan]

Thank you Niko .. Now its working Fine ... 

[Yosep]

Hi I've read the code but it supports C language, can you help me to convert this script to VB language , because I got a problem since a create the new instance using a therotator.datasource = "I think this is the image path" but how could I name for the id thank you very much , I already tried using a class but it didn't work .

theRotator.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 },
            new { image = "~/content/motorcycles/5.png", id = 5 },
            new { image = "~/content/motorcycles/6.png", id = 6 }
        };

How could this code translated in VB language. Thank you very much

[Slav]

Hi Yosep,

The following code sample will help you implement the requested functionality into a VB project:

theRotator.DataSource = New Object () {New With { _
        .image = "~/content/motorcycles/1.png", _
        .id = 1 _
    }, New With { _
        .image = "~/content/motorcycles/2.png", _
        .id = 2 _
    }, New With { _
        .image = "~/content/motorcycles/3.png", _
        .id = 3 _
    }, New With { _
        .image = "~/content/motorcycles/4.png", _
        .id = 4 _
    }, New With { _
        .image = "~/content/motorcycles/5.png", _
        .id = 5 _
    }, New With { _
        .image = "~/content/motorcycles/6.png", _
        .id = 6 _
    }}

I noticed that you have sent also a support ticket on the matter at hand. Please use only one ticket for a particular problem so that we are able to keep track of the discussion and to answer your requests much faster. That being said, let us continue our conversation in the support ticket that you have opened.

Kind regards,
Slav
the Telerik team