ListBox Data Binding with DataSource|UI Control for ASP.NET AJAX, C#, VB.NET

ListBox Data Binding with DataSource in ASP.NET

Home > How to > ListBox Data Binding DataSource

Being a professional and extremely easy to use APS.NET AJAX UI DLL component, Kettic ListBox control provides a few options for users to achieve simple data binding within their User Interface project.

In this guiding, we will show you how you can easily bind your listbox to three types of commonly used ASP.NET declarative datasources, which are SqlDataSource, EntityDataSource and LinqDataSource respectively. Besides these data source, we also provide ListBox data binding to XML.

Before we get down to the three supported data binding options and demos, you might want to get to know a few properties and methods which you might need in the data binding process later on.

DataSourceID: This is a property of great importance as you can see it is applied basically in all the three data binding scenarios below. This property is used to indicate the ID of your listbox data source. If you want to declaratively bind your listbox DataSource then this property cannot be omitted.

DataTextField: This is another basic property which you might want to apply in your application. Originally the field name for your data binding data source, this property can be used to demonstrate the text for your listbox items.

DataValueField: Once you have set the displaying text for your data binding ListBox items, you might want to apply this property to display the value for the corresponding items.

The three properties introduced here are the most basic and widely used ones in most of the cases, but of course we support plenty of other properties and methods to achieve various purposes. You can find out more in the download package.

Bind ListBox to SqlDataSource

To begin with, users can easily bind your Kettic ListBox to SqlDataSource. In the following sample, we will show you how to do that with simple aspx code. In the demo here, you will firstly set your DataSourceID to SqlDataSource1. And then set DataTextValue to ProductName. After that you can set DataValueField to ProductID. Finally you can arrange the order as by ProductName and then it is done!

<kettic:PerListBox ID="PerListBox2" runat="server" Height="200px" DataSourceID="SqlDataSource1"
                    DataTextField="ProductName" DataValueField="ProductID" Width="160px">
                </kettic:PerListBox>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                    ProviderName="System.Data.SqlClient" SelectCommand="SELECT [ProductID], [ProductName] FROM [Products] ORDER By ProductName">
                </asp:SqlDataSource>

Bind ListBox to EntityDataSource

Binding your Kettic ListBox to EntityDataSource is also an easy job with just a few aspx sample codes here. In the example below, we will guide you to achieve EntityDataSource databinding with your listbox. You will set DataSoureID to EntityDataSource1, DataTextField to ContactName, and customize a few more ones like DefaultContainerName & EntitySetName, and there you go!

<kettic:PerListBox runat="server" ID="PerListBox1" Height="200px" Width="200px"
            DataSourceID="EntityDataSource1" DataTextField="ContactName">
        </kettic:PerListBox>
        <asp:EntityDataSource ID="EntityDataSource1" runat="server" ConnectionString="name=NorthwindEntities"
            DefaultContainerName="NorthwindEntities" EntitySetName="Customers" Select="it.[ContactName], it.[City], it.[ContactTitle]"
            AutoPage="true" OrderBy="it.[ContactName]">
        </asp:EntityDataSource>

Bind ListBox to LinqDataSource

If you ever need to bind your Kettic ListBox to LinqDataSource, you can also easily achieve it with this ListBox ASP.NET AJAX UI library component. The aspx sample codes is a perfect demo for that. In the demo we have set DataSourceID to LingDataSource1, and DataTextField to ContactName, along with some other customizations including ContextTypeName, OrderBy and TableName, etc. Of course you can make some modifications according to your project if necessary.

<kettic:PerListBox runat="server" ID="PerListBox1" Height="200px" Width="200px"
            DataSourceID="LinqDataSource1" DataTextField="ContactName">
        </kettic:PerListBox>
        <asp:LinqDataSource runat="server" ID="LinqDataSource1" ContextTypeName="PerAspNetAjaxControlsSample.LinqAndEntity.LinqToSql.NorthwindDataContext"
            OrderBy="ContactName" Select="new (ContactName, City, ContactTitle)" TableName="Customers">
        </asp:LinqDataSource>

ASP.NET AJAX UI Controls

ASP.NET AJAX ListBox UI Control

Overview Getting Started Elements

Features

Reorder Transfer Drag and Drop Button Configuration CheckBoxes Load On Demand Templates

Data Binding

XML Data

DataSource Data

Client Prpgramming

ListBox Event

Server Prpgramming

ListBox Event ASP.NET AJAX ListView UI Control ASP.NET AJAX ToolBar UI Control ASP.NET AJAX TabControl UI Control ASP.NET AJAX Menu UI Control ASP.NET AJAX ToolTip UI Control