A GridView that gets data from LinqDataSource (Part 2) November 5, 2009

Introduction: in this post I will discuss how to create a GridView whose data source is a LinqDataSource. The application will support the following features:

-         Paging, editing, deleting, and insertion of a new entry.

-         Using some AJAX controls AjaxControlToolkit such as CalenderExtender.

-         Validation using RegularExpressionValidator (inside the grid).

-         Cleaning up the foreign-key values & replacing them with their values (Binding UI with ASP LinqDataSource).

Part 2 Abstract:  you will expect in this part to know about:

-         Cleaning up the foreign-key values & replacing them with their values (Binding UI with ASP LinqDataSource).

Note:  If you find that something is ambiguous you might need to refer to the previous parts.

Now we need to replace the foreign-key values in the grid with the actual data i.e. instead of displaying the Employee ID its more user friendly to display the Employee name!!

Let’s think about what shall we do?

If we look at the GridView code it will look like this:

Some BoundFields that are data bound to the columns of the Order table, which I address using LinqDataSource. The solution that I felt better is to replace the BoundFields I don’t wish to display by TemplateFields.

TemplateFields allows me to display the Customer name instead of his ID by evaluating data-binding expression. It also provides a property called EditItemTemplate which is the state of the column in the editing mode (if not set the column can’t be edited).

The TemplateField of the Customer should be as follows:

When I replace this code with the Customer TemplateField the Customer name will appear instead of his ID

When I press edit, I will find that I can’t edit it!!

I can’t edit because I didn’t add EditItemTemplate

Let’s Go and add it now but to prevent users from entering invalid Customer name during the editing mode it is better to display all the customers in a DropDownList while in editing mode, but the DropDownList requires a data source so I created a LinqDataSource called CustomerDataSource.

If you noticed here I just need the Customers’ name and ID. The Name will act as the DataTextField and the ID will act as the DataValueField in the DropDownList.

Then I will add the EditItemTemplate so the TemplateField I will create a DropDownList that’s DataSourceID is the CustomerDataSource and assign the DataValueField and DataTextField respectively as discussed before, it must look like this:

Now let’s run and see what I’ve done:

Then I will do the same to the EmployeeID and ShipVia columns.

That is the end of part 2.

Mohamed Atia
MCTS

A GridView that gets data from LinqDataSource (Part 1) November 1, 2009

Introduction: in this post I will discuss how to create a GridView whose data source is a LinqDataSource. The application will support the following features:

-         Paging, editing, deleting, and insertion of a new entry.

-         Using some AJAX controls AjaxControlToolkit such as CalenderExtender.

-         Validation using RegularExpressionValidator (inside the grid).

-         Cleaning up the foreign-key values & replacing them with their values (Binding UI with ASP LinqDataSource).

Part 1 Abstract:  you will expect in this part to know about:

-         Paging, editing, deleting.

Resources: Visual Studio 2008, SQL Server 2005 Express Edition

Prerequisites: Readers of this post must have a good knowledge about ASP.Net and LINQ to SQL, I will suppose that you know how to create and use Data Classes our .dbml file should look like this :

In this tutorial our data source is Microsoft Northwind Sample database we will show the Orders table in the GridView.

Let’s get started.

I just dragged and dropped a GridView from the ToolBox.

 

Step 1: We need to Create a LinqDataSource, this can be done easily using the wizard as follows:

Step 2: Select LINQ then press next

Step 3: Make Sure that u selected the appropriate Data Classes

Step 4: Select thr required table (in our case Orders) and click Advanced

Step 5: Make sure that the Check Boxes are checked, this sets the properties of the LinqDataSource which are EnableDelete, EnableInsert, and EnableUpdate to true.

Step 6: Make sure that the Grid enables paging, sorting, editing, and deletion. I am not concerned about selection in this article.

Now let’s run the project and see what we get

If I click delete, the order will be deleted from the database , if I click update the following will happen:

Marvelous and simple!!

Update some values then click update it will reflect in the database.

What I have done is the simple part; I almost used Wizards and UI.

I haven’t yet completed writing this article but this is the end of this part.

Mohamed Atia
MCTS