Client Side API--Is there a way to set index

[Ali Sedehi]

Is there a way to set the index using the client side JS API? I have thumbnail images that when clicked i want the correct large image to show...currently i'm doing it using InitialItemIndex in the server side code, but want to avoid a postback...

thank you for the help!

 

[Fiko]

Hello Ali,

Yes we have implemented this functionality as part of the client-side API of the RadRotator control and you can get the index of the clicked item on the client by catching theOnClientItemClicked event of the RadRotator e.g  as shown below:

function OnClientClick(sender, arg)
{
    var clickedItem = arg.get_item();
    var clickedItemIndex = clickedItem.get_index();
    alert(" Current Item's index is :" + clickedItemIndex);
}

For demonstration purposes I simply show the index of the clicked item, but you can implement your own functionality there.


All the best,
Fiko
the Telerik team

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

[deesnider]

This seems to work for me. 

$find('<%= RadRotator1.ClientID %>').set_initialItemIndex(iIndex);
$find('<%= RadRotator1.ClientID %>')._loadInitialFrame();

Found the latter function digging through the JS file.  Note by calling a 'hidden' function like this you could mess up other events, etc. but for my purposes this was all I was looking for.

EDIT: oops, sorry no it doesn't...I'll keep looking...

[deesnider]

Doesn't seem possible on the client side, even tho I thought some posts here alluded to it 'coming soon' last fall.  None of the client side events seem to work to 'jump' to a specified item index.  The rotator seems to be meant to be more of a scroll next/previous only.  You could get cute with those methods and try to 'jump' by a specified number of calls to each, tho that is ugly as the methods you call differ if it's a viewport or item scroller.  And at that seemed a little too complicated if possible.

I ended up just using an AJAX call and set the .InitialItemIndex on the server side.  The effect appears to happen on client-side as far as the user can tell.  But I'd still prefer a pure client-side method in the future, slightly cleaner.

[Fiko]

Hello Deesnider,

We received several requests about that functionality - set a specific initial item index of the RadRotator control from the client code. We currently working on the set_initialItemIndex() function and our developers will extend its functionality in order to cover that requirement. This will happen in one of the following updates of the RadRotator control.




Kind regards,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Wayne]

May not be pretty.. but this works for me.

function setFrame(frame) {
        var rotator = $find('<%= rotFeatured.ClientID %>');
        var item = rotator.get_currentItem();
        var index = item._index + 1;

        if (frame == index) {
            return;
        }

        if (frame > index) {
            while (frame > index) {
                rotator.showNext(Telerik.Web.UI.RotatorScrollDirection.Left);
                frame--;
            }
        } else {
            while (frame < index) {
                rotator.showNext(Telerik.Web.UI.RotatorScrollDirection.Right);
                frame++;
            }
        }
    }