NavigationBar Data Binding with ObjectDataSource|UI Control for ASP.NET AJAX, C#, VB.NET

Data Binding NavigationBar to an ObjectDataSource in ASP.NET

Home > How to > NavigationBar Binding ObjectDataSource Data

Nowadays, the interaction between web browser, web server and database has been increasingly important for any business system. To help users have an easy access to database with the navigationbar in web pages, the PerNavigationBar control adds the data binding feature. The data binding functions allow users to easily bind navigationbar to several data types, like sql database, access database, XML file, ObjectDataSource and LinqDataSource.

And from this online tutorial, you will find detailed programming guidance on how to bind navigation bar to object-based database in ASP.NET web application.

How to Bind NavigationBar to Object-based Data Source

In this part, we mainly list the two essential steps that are involved in the navigationbar databinding application.

1. With following sample C# code, you can easily add the object list that needs to be bound to navigationbar.

public class SiteDataItem
    {
        private string _text;
        private string _url;
        private int _id;
        private int? _parentId;

        public string Text
        {
            get { return _text; }
            set { _text = value; }
        }

        public int ID
        {
            get { return _id; }
            set { _id = value; }
        }

        public int? ParentID
        {
            get { return _parentId; }
            set { _parentId = value; }
        }
        public string Url
        {
            get { return _url; }
            set { _url = value; }
        }

        public SiteDataItem(int id, int? parentId, string text)
        {
            _id = id;
            _parentId = parentId;
            _text = text;
        }
        public SiteDataItem(int id, int? parentId, string text, string url)
        {
            _id = id;
            _parentId = parentId;
            _text = text;
            _url = url;
        }

        public static List<SiteDataItem> GetSiteData()
        {
            List<SiteDataItem> siteData = new List<SiteDataItem>();
            siteData.Add(new SiteDataItem(1,null,"Kettic Creative Products"));
            siteData.Add(new SiteDataItem(2, 1, "PerControls for ASP.NET Ajax"));
            siteData.Add(new SiteDataItem(3, 1, "PerControls for Silverlight"));
            siteData.Add(new SiteDataItem(4, 2, "PerGridView"));
            siteData.Add(new SiteDataItem(5, 2, "PerScheduler"));
            siteData.Add(new SiteDataItem(6, 2, "PerEditor"));
            siteData.Add(new SiteDataItem(7, 3, "PerGrid"));
            siteData.Add(new SiteDataItem(8, 3, "PerMenu"));
            siteData.Add(new SiteDataItem(9, 3, "PerEditor"));

            return siteData;
        }

    }

2. Following C# code is used to add object database to target navigationbar.

protected void Page_Load(object sender, EventArgs e)
        {
            List<SiteDataItem> siteData = SiteDataItem.GetSiteData();

            PerNavigationBar1.DataTextField = "Text";
            PerNavigationBar1.DataNavigateUrlField = "Url";
            PerNavigationBar1.DataFieldID = "ID";
            PerNavigationBar1.DataFieldParentID = "ParentID";

            PerNavigationBar1.DataSource = siteData;
            PerNavigationBar1.DataBind();
            PerNavigationBar1.Items[0].Expanded = true;
        }

Here we attach an image which represents the result of above C# programming navigationbar to object-based data source data binding application.

Note: In order to let you run the PerNavigationBar control successfully in your web application, please make sure that your ASP.NET web application has installed NET Framework 3.5 or above versions and that you have installed all the necessary dlls from our ASP.NET AJAX SDK into your ASP.NET web application.

Related NavigationBar Data Binding Tutorials

Apart from the function to bind navigationbar to the object based data source, the PerNavigationBar Control also allows users to bind the navigationbar to other data types, like

ASP.NET AJAX UI Controls

ASP.NET AJAX Chart UI Control ASP.NET AJAX Grid UI Control ASP.NET AJAX Barcode UI Control ASP.NET AJAX Button UI Control ASP.NET AJAX Calendar UI Control

ASP.NET AJAX NavigationBar UI Control

Overview Getting Started Elements Templates Features

Data Binding

ObjectDataSource Data

Database Data XML Data

Client Prpgramming

Item Event

Server Programming