Ajax Control Toolkit Example: Using HoverMenuExtender
First Step: Add latest Ajax Control Toolkit in your toolbox
Right click on toolbox tab and add new item.
Second Step:Drag an drop HoverMenuExtender and radiobuttonlist in your body tag.
<head runat="server"> <title>Ajax Hover Menu Extender</title> <style type="text/css"> .PanelCSS { visibility:hidden; } </style> </head>
<div>
<h2 style="color:DeepPink; font-style:italic;">Ajax Control Toolkit Example: Using HoverMenuExtender</h2>
<hr width="550" align="left" color="Pink" />
<asp:ScriptManager
ID="ScriptManager1"
runat="server"
>
</asp:ScriptManager>
<asp:HoverMenuExtender
ID="HoverMenuExtender1"
runat="server"
TargetControlID="Label1"
PopupControlID="Panel1"
PopupPosition="Bottom"
>
</asp:HoverMenuExtender>
<br /><br />
<asp:Label
ID="Label1"
runat="server"
Text="Color changeable label."
Font-Size="XX-Large"
Font-Names="Comic Sans MS"
>
</asp:Label>
<asp:Panel
ID="Panel1"
runat="server"
Width="300"
BorderColor="Gray"
BorderWidth="1"
CssClass="PanelCSS"
>
<asp:RadioButtonList
ID="RadioButtonList1"
runat="server"
RepeatColumns="3"
OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged"
AutoPostBack="true"
>
<asp:ListItem>Tan</asp:ListItem>
<asp:ListItem>Crimson</asp:ListItem>
<asp:ListItem>DarkBlue</asp:ListItem>
<asp:ListItem>SeaGreen</asp:ListItem>
<asp:ListItem>OrangeRed</asp:ListItem>
<asp:ListItem>Magenta</asp:ListItem>
<asp:ListItem>DeepPink</asp:ListItem>
</asp:RadioButtonList>
</asp:Panel>
</div>
3 step: In default.aspx.cs
protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
{
Label1.ForeColor =System.Drawing.Color.FromName(RadioButtonList1.SelectedItem.Text);
}
OUTPUT:
Happy coding..
No comments:
Post a Comment