Bluegenegeek

In this post I will talk about how to build tabular data using ADO.NET EntityFramework and sort tabular / grid data using JQuery table sorter plugin. For the sake of demo I will use ASP.NET 4 and .NET Framework 4.

Fire up Visual Studio 2010 and Create a New ASP.NET WebSite. For this demo I will use ADO.NET Entity Framework to get a list of Products from the database.

I will use AdventureWorks Database for the sake of this demo.

Add a new ADO.NET Entity Data Model, select “generate from database”, hit next choose the and add the product’s table

Add a new C# Class and class it Product.cs this class will be in the same namespace as the EntityDataModel and the Product class will extend as a partial class from the class created by ADO.NET EntityFramework. Here is how the class should look like –

We created a method called GetProducts which just takes the top 200 rows in from the Products table. This method will return a List of Products of type IQueryable.

Now add a new ASP.NET WebForm and call it Products.aspx. In Products.aspx drag drop a GridView and set its DataSource as ObjectDataSource, in the GridView tasks choose new DataSource and Choose object as Data Source Type,

From the choose a Business Object Screen Choose the Products Class we just created.

For the select method Choose the GetProducts method we created earlier.

Choose the necessary columns from the gridview, I choose a few columns for this demo. Once you are done with choosing columns your Products.aspx code should look something like this –

Run the application and this is how your products list will show up.

Download JQuery 1.4.1 and tablesorter plugins and them to the scripts folder of the website. Once done add these scripts to the head section of master page.

In the HTML for gridview now let’s add a CSS class so that we can use it find the table by JQuery.

Note the CssClass Property above which is set to tablesorter.

Now add the following script in the products.aspx page –

Run the application. Your application should be something similar to this –

Notice the sort up and sort down arrows.

Hope this helps.

Cheers,

Venkata

This one is a quick code snippet,

Here is a method which can round a value to nearest 100,1000, or any 10 Pow N.

This method follows the rounding rules –

1
private static int RoundToNDigits(double value,int digits)  
2
        {  
3
            int valueAfterDecimal = Convert.ToInt32(value % Math.Pow(10, digits));  
4
            int valueBeforeDecimal = Convert.ToInt32(value) / Convert.ToInt32(Math.Pow(10, digits));  
5
            if (valueAfterDecimal < 50)  
6
            {  
7
                return valueBeforeDecimal * Convert.ToInt32(Math.Pow(10, digits));  
8
            }  
9
            else if (valueAfterDecimal > 50)  
10
            {  
11
 
12
                return Convert.ToInt32((valueBeforeDecimal + 1) * Math.Pow(10, digits));  
13
            }  
14
            else  
15
            {  
16
                if (valueBeforeDecimal % 2 == 0)  
17
                    return (valueBeforeDecimal + 1) * Convert.ToInt32(Math.Pow(10, digits));  
18
                else  
19
                    return valueBeforeDecimal * Convert.ToInt32(Math.Pow(10, digits));  
20
            }  
21
        } 

Hope this helps,
Cheers,
Venkata