Telerik Code Library / UI for ASP.NET AJAX Code Library / Rotator /

RadContextMenu for RadRotator

Telerik UI for ASP.NET AJAX
Resources Buy Try

Thread is closed for posting

2 posts, 0 answers

E69AACB4-3C5B-42BC-9BDD-D0F081D8FE34

17421 posts

Member since:
Mar 2007

Posted 23 Feb 2011 Link to this post

Requirements
RadControls version	2010, 3, 1215, 20
.NET version	3.5 SP1
Visual Studio version	2008
programming language	C#, Javascript
browser support	all browsers supported by RadControls

PROJECT DESCRIPTION
This project demonstrates how to show RadContextMenu for RadRotator. In order to access corresponding RadRotator item, attach 'OnClientMouseOver' client-side event to RadRotator and save the item index in HiddenField control. Now in 'OnItemClick' event of RadContextMenu, get the index using the HidddenField value.

ASPX:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style type="text/css">

.RotatorItem

{

width: 132px;

height: 112px;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<telerik:RadContextMenu ID="RadContextMenu1" runat="server" OnItemClick="RadContextMenu1_ItemClick">

<Items>

<telerik:RadMenuItem Text="Preview">

</telerik:RadMenuItem>

</Items>

</telerik:RadContextMenu>

<telerik:RadRotator ID="RadRotator1" runat="server" Width="264px" Height="112px"

OnClientMouseOver="OnClientMouseOver" ItemHeight="112" ItemWidth="132" ScrollDuration="500"

AutoPostBack="true" OnItemClick="RadRotator1_ItemClick">

<Items>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image" ImageUrl='~/Images/Nature1.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image1" ImageUrl='~/Images/Nature10.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image2" ImageUrl='~/Images/Nature2.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature3.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature4.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature5.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature6.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature7.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature8.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

<telerik:RadRotatorItem>

<ItemTemplate>

<asp:Image runat="server" ID="Image3" ImageUrl='~/Images/Nature9.jpg' CssClass="RotatorItem"

AlternateText="Customer Image" />

</ItemTemplate>

</telerik:RadRotatorItem>

</Items>

</telerik:RadRotator>

<asp:HiddenField ID="HiddenField1" runat="server" />

</div>

</form>

</body>

</html>

<script type="text/javascript">

function OnClientItemClicked(sender, args) {

}

function OnClientMouseOver(sender, args) {

var hf = document.getElementById('HiddenField1');

hf.value = args.get_item().get_index();

}

</script>

C#:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

foreach (RadRotatorItem item in RadRotator1.Items)

{

ContextMenuControlTarget target = new ContextMenuControlTarget();

target.ControlID = item.ID;

RadContextMenu1.Targets.Add(target);

}

}

protected void RadRotator1_ItemClick(object sender, RadRotatorEventArgs e)

{

}

protected void RadContextMenu1_ItemClick(object sender, RadMenuEventArgs e)

{

int index = Convert.ToInt32(HiddenField1.Value);

}

}

Thanks,
Princy.

56C0FF26-515E-44BD-AA99-826191D02C58

404 posts

Member since:
Apr 2017

Posted 25 Feb 2011 Link to this post

Hi Princy,

Thank you for your contribution! Your efforts are appreciated.

Best wishes,
Nikodim
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Back to Top

This Code Library is part of the product documentation and subject to the respective product license agreement.