How to Show Data from Any Source such as Array, DataTable, WebService and Database Using Asp.Net ListView and ObjectDataSource

A web page is about to show a data. This data may generate from database or other object like an class instance.

Mostly, data is presented to a table and a lot of tutorial about making a table that I have is related to database. Developers have a listview / gridview / repeater etc for data view and sqldatasource control as a data source.

Although sqldatasource is good and may increase productivity. An organisation is not always use SQL Server and one of their web tables may not use database at all.

So I prefer to use ObjectDataSource control. This control is more generic data source because we use our own bare class to return a DataTable instance. Since we write our own class then inside it we can code an operation to any RDBMS or work with any objects.
ObjectDataSource control is also good option to retrieve data via Web Service from another Server and maybe that Server is located at different site. We cant see any code like database connection in Web Service but only class and namespace reference of it. Although maybe there is a database operation inside Web Service itself.

In this blog post, I generate the data manualy to DataTable in the first example and secondly, I generate it from webservice and database. Both of them show data via listview and use arbitrary class that I make. ObjectDatasource acts as bridge between this custom class instance and listview.

Adding Data Manualy to DataTable

Here’s the example:
I will show simple table that has persons info with their name, city and province.
.aspx file (piece of code):


    <div>
        
        
            <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>City</th>
                    <th>Province</th>
                </tr>
            </thead>
             
            </table>    
        
        
            
            <tr>
            <td></td><td></td>
            <td></td>
            </tr>
        
       
         
        
    </div>
    


The listview has DataSourceID equals to “ObjectDataSource1”. ObjectDataSource1 is an ID of ObjectDataSource Control. This ObjectDataSource1 has TypeName value “person”.
This “person” typename is a class of our own. ObjectDataSource1 also has SelectMethod which has value “getperson”. This “getperson” is a function name to return the data itself that will showed on listview.
This “getperson” function is inside of “person” class.

Ok, lets create “person” class. Create ‘App_Code’ Asp.net folder and add new class file inside this ‘App_Code’ folder. Save it as “person.vb”

person.vb file:

Imports Microsoft.VisualBasic
Imports System.Data
Public Class Person
    Public Sub New()

    End Sub
    Public Function getperson() As DataTable
        Dim dt As New DataTable()
        dt.Columns.Add("Name")
        dt.Columns.Add("City")
        dt.Columns.Add("Province")

        Dim dr As DataRow
        dr = dt.NewRow()
        dr("Name") = "Agung"
        dr("City") = "Bandung"
        dr("Province") = "West Java"
        dt.Rows.Add(dr)

        dr = dt.NewRow()
        dr("Name") = "Dani"
        dr("City") = "Depok"
        dr("Province") = "West Java"
        dt.Rows.Add(dr)

        Dim arrRow(2) As String

        arrRow(0) = "Ugi"
        arrRow(1) = "Jakarta"
        arrRow(2) = "DKI"
        dt.Rows.Add(arrRow)

        Return dt

    End Function
End Class

Here I have Person class. I import the System.Data namespace so that I can write DataTable straightly.
The getperson() function returns DataTable. ObjectDataSource’s SelectMethod attribute should return a DataTable.
Since I dont want to retrieve data from database in this first example, I just create a DataTable columns and rows and fill in their value manually.

First, create an instance of DataTable class. Second create a DataTable columns with dt.Columns.Add(<column_name>) function.
Third, create a DataTable rows or DataRow with dr = dt.NewRow() function followed by specifying row value with its column index dr("<column_name>")="row_value"
Use dt.Rows.Add(dr) to add this row to DataTable. To add more rows just use third step repeatedly.

As an alternative way to create a row, we can use an array instead of DataRow. I created two rows with DataRow and for the third I use string array.
Just declare a string array (arrRow) and fill in its value in sequence order. Add it to DataTable with same function dt.Rows.Add(arrRow).

This picture below is how it’s look:

Consuming Web Service & Database

I have a web service which connecting to SQL DB and retrieve person data from my “tb_person” table at “TestDB” database. I name it “personWebService”. Since I wrote it in same website project I dont have to add web reference.
If the web service resides in different website then you have to add ‘Web Reference’ and point it to correct related WebService’s Url.

To create a web service just right click the project in VS, add new item, web service, save it as “personWebService”.
The code:

Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Data
Imports System.Data.SqlClient

' To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
'  _
 _
 _
 _
Public Class personWebService
     Inherits System.Web.Services.WebService

     _
    Public Function ListPerson() As DataTable
        Dim dt As New DataTable()
        Using conn As New SqlConnection(connectionstring)
            conn.Open()
            Dim comm As New SqlCommand("select Name, City, Province from tb_person", conn)
            Dim da As New SqlDataAdapter(comm)
            da.Fill(dt)
            comm.Dispose()
        End Using

        Return dt
    End Function

End Class

It has only one function ListPerson() in this WebService which retrieving person data from SQL Database. You should be familiar already with SqlConnection, SqlCommand and SqlDataAdapter.

After that we can change the code inside Person Class function getperson() to below:

Public Function getperson() As DataTable
        Dim dt As New DataTable()
        Dim personWb As New personWebService()
        dt = personWb.ListPerson()

        Return dt
    End Function

So at ObjectDataSource point of view, it has webservice class reference only.
Run the website again you should see same look as before.

Basically we can write anything such as database records retrieval, web service implementation, math calculation, etc inside our custom class. So using ObjectDataSource is more flexible to retrieve data.

Cheers,

Agung Gugiaji

Advertisements

One response to “How to Show Data from Any Source such as Array, DataTable, WebService and Database Using Asp.Net ListView and ObjectDataSource

  1. Pingback: SSRS 2008 R2 Programmatic List Running Reports/Jobs & Cancel Examples | Enlighten Application Developer Journals

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s