Setting item index is not setting item correctly.

[Damodar]

Hi,
I have aspx page it has usercontrol, radwindow,  and inside radwindow it has radrotator.

User control  has gridview when user click linkbutton inside gridview, I am showing radwindow as a popup.
When loading aspx page I am binding data to radrotator.

When user clicks link current item is not setting properly. 
But when the window is closed and reopened it works fine.
//aspx
<telerik:RadWindowManager ID="RWM" Height="640px" Width="870px" ShowContentDuringLoad="false" ReloadOnShow="true" runat="server">
       <Windows>
         <telerik:RadWindow ID="RW_Detail" Localization-Restore="none" runat="server" Modal="True"
                    VisibleStatusbar="False" Behaviors="Close" Title="Deck Images" IconUrl="~/images/SmallLogo.jpg">
                    <ContentTemplate>
                        <div style="background-repeat: no-repeat; box-sizing: border-box; -moz-box-sizing: border-box;">
                            <div style="margin: 0 auto;">
                                <telerik:RadRotator ID="RadRotatorDetail" Height="525px" Width="850px" BorderColor="Transparent"
                                    ItemWidth="836px" BorderWidth="0" WrapFrames="false" RotatorType="Buttons" runat="server"
                                    ControlButtons-LeftButtonID="img_left" ControlButtons-RightButtonID="img_right" Skin="MetroTouch">
                                    <ItemTemplate>
                                        <div style="overflow-y: auto; height: 510px; width: 836px">
                                            <asp:Image ID="imgDetails" ImageUrl='<%# Eval("ID")+"\\"+Eval("ImageName")%>'
                                                SlideID='<%#Eval("ID") %>' runat="server" ImageAlign="Middle" />
                                            <br />
                                        </div>
                                    </ItemTemplate>
                                </telerik:RadRotator>
                            </div>
                            <div>
                                <div style="float: right;">
                                    <asp:Image ImageUrl="~/images/ticks/arrow_right.png" ID="img_right" AlternateText="right" runat="server"
                                        Style="margin: -10px 0px; cursor: pointer;" />
                                </div>
                                <div style="float: left">
                                    <asp:Image ImageUrl="~/images/ticks/arrow_left.png" ID="img_left" AlternateText="left" runat="server"
                                        Style="margin: -10px 0px; cursor: pointer;" />
                                </div>
                            </div>
                        </div>
                        <br />
                    </ContentTemplate>
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
//Inside Aspx.cs
MainDetails mDetails = new MainDetails();
DataSet ds = mDetails.Get_Details(m_ID, false) as DataSet;
RWM.Shortcuts.Add("Close", "Esc");
RadRotatorDetail.DataSource = ds;
RadRotatorDetail.DataBind();
<asp:TemplateField HeaderText="More Detail">
<ItemTemplate>
<asp:LinkButton ID="LB" runat="server" OnClientClick=<%# "Show_Window('" + Eval("ID") +"'); return false;" %>
                     Text='<%# Eval("Pro_Name") %>'></asp:LinkButton>
	
</ItemTemplate>
<ControlStyle Font-Bold="False" ForeColor="#003399" />
     <ItemStyle HorizontalAlign="Justify" />
</asp:TemplateField>





//javascript inside usercontrol.
<script type="text/javascript">
    function Show_Window(ID) {
        var oManager = GetRadWindowManager();
        var oWnd = oManager.GetWindowByName("RW_S");
        var radRotator = GetRadRotator();
        var RadImgItems = radRotator.get_items();

	   ID = firstItem(ID);
        for (var name in RadImgItems) {
            if (ID == GetAttributeValue(RadImgItems[name], "SlideID")) {
                radRotator.set_currentItemIndex(RadImgItems[name].get_index(), false);
                radRotator.repaint();
            }
        }         
        oWnd.Show();
    }
    function firstItem(ID) {
        if (ID.indexOf(",") !== -1) {
            var firstItemName = ID.substring(0, ID.indexOf(","));
        }
        else
            firstItemName = ID;
        return firstItemName.trim();
    }
    function GetAttributeValue(item, name) {
        return $telerik.$(item.get_element()).find("img").attr(name);
    }

Am I missing something?
How to force it to load correct index?
In first popup it does goes through
 radRotator.set_currentItemIndex(RadImgItems[name].get_index(), false);

Best Regards,
Damdoar

[Slav]

Hello Damodar,

The displayed RadRotator item should be set correctly when you add some timeout before configuring the current item index:

setTimeout(function () {
    radRotator.set_currentItemIndex(index, false);
}, 10);

I would also recommend checking if the correct index is specified as a parameter of the function set_currentItemIndex.

Regards,
Slav
the Telerik team

[Damodar]

Hi Slav,

for (var name in RadImgItems) {
if (ID == GetAttributeValue(RadImgItems[name], "SlideID")) {
   var index = RadImgItems[name].get_index();
        setTimeout(function (){
             radRotator.set_currentItemIndex(index, false);
         },10);
         radRotator.repaint();
    }
  }
    oWnd.Show();

When I do this it is showing only last item.
Am I missing any thing?
Checked the index in set_currentItemIndex and it is correct. 

Best Regards,
Damodar

[Slav]

Hello Damodar,

I have attached a sample page that implements a similar approach for setting the current index of a RadRotator. Please use it as a reference for achieving the desired effect on your end.

Greetings,
Slav
the Telerik team

[Damodar]

Hi Slav,

Thank you very much. It has done the trick.
Modified the script and it's working fine.

Best Regards,
Damodar

[Damodar]

Hi Slav,

One more question!
If I want to remove horizontal scroll bar. How do we do that?

My image size is roughly width: 836px height: 3950px.



Best Regards,
Damodar

[Slav]

Hello Damodar,

If you set more width to the RadWindow so that there is enough space to display all of its content, the horizontal scroll bar will not appears. You can do this via the Width property of the control or by setting AutoSize to true so that the window size is automatically adjusted according to its content.

Regards,
Slav
the Telerik team