65.9K
CodeProject is changing. Read more.
Home

New Ajax Navigation Bar

starIcon
emptyStarIcon
starIcon
emptyStarIconemptyStarIconemptyStarIcon

1.10/5 (9 votes)

Nov 30, 2007

CPOL

1 min read

viewsIcon

44428

downloadIcon

951

New Ajax Navigation Docable Bar

Introduction

This is Ajax Docable Navigation Bar. Which will look like Windows XP Navigation. After Installing the application. Type this link in your Browser http://localhost/nvbar/frmCTHomePage.aspx

Background

Fully Based Upon Ajax. This is really nice one.

Using the code

After installing ajax in your system. run this application and see.

This is Dynamically passing Values to the Navigation bar.

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

<asp:Panel ID="Panel1" runat="server" Height="540px" Width="180px" BackImageUrl="~/images/backcolor1.PNG">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>
<center>
<table><tr><td>
<ajaxToolkit:Accordion id="dictionaryBound" runat="server" SelectedIndex="0"
HeaderCssClass="accordionHeader" HeaderSelectedCssClass="accordionHeaderSelected"
ContentCssClass="accordionContent" FadeTransitions="true" FramesPerSecond="40"
TransitionDuration="150" AutoSize="None" RequireOpenedPane="false" SuppressHeaderPostbacks="true" Width="167">
<HeaderTemplate>
<%# Eval("Key") %>
</HeaderTemplate>
<ContentTemplate>
<%# Eval("Value") %>
</ContentTemplate>
</ajaxToolkit:Accordion>
</td></tr>
<tr>
<td><br /><br />

</td></tr>
<tr><td> <asp:XmlDataSource ID="xml1" runat="server" DataFile="navxml.xml"/>
<ajaxToolkit:Accordion id="xmlBound" runat="server" DataSourceID="xml1" SelectedIndex="0"
HeaderCssClass="accordionHeader" HeaderSelectedCssClass="accordionHeaderSelected"
ContentCssClass="accordionContent" FadeTransitions="true" FramesPerSecond="40"
TransitionDuration="150" AutoSize="None" RequireOpenedPane="false" SuppressHeaderPostbacks="true" Width="167">
<HeaderTemplate>
<%# Eval("name") %>
</HeaderTemplate>
<ContentTemplate>
<%# Eval("name") %>
</ContentTemplate>
</ajaxToolkit:Accordion></td></tr></table>
</center>
</ContentTemplate> </asp:UpdatePanel>
</asp:Panel>

This code is to pass the values dynamically to navigetion bar:

protected void Page_Load(object sender, EventArgs e)
{
dictionaryBound.Attributes.Add("OnMouseMove", "mousemove()");
if (!IsPostBack)
{

this.DataBind();

Dictionary<string, string> values = new Dictionary<string, string>();
//LinkButton dynamicbutton = new LinkButton();
//dynamicbutton.ID = "b_link1";
//dynamicbutton.Text = "Message";
values["Inbox"] = "";
values["OutBox"] = "This is the value for B";
values["Draft"] = "This is the value for C";
values["SentItems"] = "This is the value for D";
dictionaryBound.DataSource = values;
dictionaryBound.DataBind();
}

}

History

If u have any doubts Contact me to this Email ID dilip.kumar22@rediffmail.com or dilipkumar22@gmail.com