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

Server-side events when selection changes?

2 Answers 48 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
Wayne
Top achievements
Rank 1
Wayne asked on 07 Jun 2016, 02:08 PM
I have a rotator control that has a list of periods bound do it (think like a Category).  When I click the button to move to a new selection, I want a grid to update with the information for that period (e.g. grab the ID of the selected period, and query for it).  There doesn't seem to be a way to do this server-side though, only on the client.  Is my only recourse to use Ajax to pull the data and refresh the grid when something changes in the RadRotator?

2 Answers, 1 is accepted

Sort by
0
Wayne
Top achievements
Rank 1
answered on 07 Jun 2016, 02:29 PM
Let me clarify I mean when the buttons to switch the visible item in the rotator is clicked, not the item inside (it's just a label).
0
Vessy
Telerik team
answered on 10 Jun 2016, 02:38 PM
Hi Wayne,

If I understand your requirements properly you want to update the content of a Grid when the prev/next button of the Rotator is clicked. if so, I am afraid that the scrolling of the items of the Rotator is done on the client, thus you will need to initiate the update of the Grid client-side. A possible way to implement this is to assign a handler to the Rotator's ClientItemShown event and make an AJAX request from it.

For example, you can use a similar logic:
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
 
<telerik:RadRotator ID="RadRotator1" runat="server" Width="300px" RotatorType="Buttons" ScrollDuration="500" OnClientItemShown="OnClientItemShown">
    <ItemTemplate>
        <div class="RotatorItem" style="width: 300px">
            <h2>
                <asp:Label ID="lblTitle" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "title") %>'></asp:Label></h2>
            <div>
                <asp:Label ID="lblShortDesc" Text='<%# DataBinder.Eval(Container.DataItem, "desc")%>' runat="server"></asp:Label>
            </div>
        </div>
    </ItemTemplate>
</telerik:RadRotator>
 
<telerik:RadGrid ID="RadGrid1" runat="server">
</telerik:RadGrid>
<script type="text/javascript">
    function OnClientItemShown(sender, eventArgs) {
        console.log(1);
        //you can pass the clicked item index as an argument of ajaxRequest();
        $find("RadAjaxManager1").ajaxRequest(eventArgs.get_item().get_index());
    }
</script>
protected void Page_Load(object sender, EventArgs e)
{
    RadRotator1.DataSource = GetData();
    RadRotator1.DataBind();
}
 
private DataTable GetData()
{
    DataTable dt = new DataTable();
    dt.Columns.Add("title", typeof(string));
    dt.Columns.Add("desc", typeof(string));
    dt.Rows.Add("T0", "AAA");
    dt.Rows.Add("T1", "BBB");
    dt.Rows.Add("T2", "CCC");
    return dt;
}
 
protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
   //your logic here
     string
index = e.Argument;
    RadGrid1.DataSource = new string[] { index, index, index, index, index, index, index };
    RadGrid1.DataBind();
}


I hope this helps.

Regards,
Vessy
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Rotator
Asked by
Wayne
Top achievements
Rank 1
Answers by
Wayne
Top achievements
Rank 1
Vessy
Telerik team
Share this question
or