Formatting asp net gridview control Part 704:33

  • 0
Published on July 2, 2017

C#, SQL Server, WCF, MVC and ASP .NET video tutorials for beginners

We will be using tblEmployee table for this demo. Use the script below to create employees table and populate it with sample data.

CREATE TABLE [tblEmployee]
(
[EmployeeId] [int] IDENTITY PRIMARY KEY,
[FirstName] [nvarchar](50),
[LastName] [nvarchar](50),
[DateOfBirth] [datetime],
[AnnualSalary] [int],
[Gender] [nvarchar](50),
[DepartmentName] [nvarchar](50)
)

Insert into tblEmployee values
(‘John’,’Johnson’,’08/10/1982′,55000,’Male’,’IT’)
Insert into tblEmployee values
(‘Pam’,’Roberts’,’11/11/1979′,62000,’Female’,’HR’)
Insert into tblEmployee values
(‘David’,’John’,’01/15/1980′,45000,’Male’,’IT’)
Insert into tblEmployee values
(‘Rose’,’Mary’,’08/18/1967′,78000,’Female’,’Payroll’)
Insert into tblEmployee values
(‘Mark’,’Mell’,’12/10/1974′,69000,’Male’,’HR’)

Use “SqlDataSource” control to retrieve data from the database and bind it to gridview control.

By default, all the columns from the table are displayed in the gridview control. For example, I don’t want to display EmployeeId column in the gridview control. There are 3 ways to achieve this
1. You can modify “SqlDataSource” control “SELECT” query, to include only the columns that you need.
2. Remove the “BoundField” column from gridview control that displays, EmployeeId
3. Set visibility property to false on the “BoundField” column from gridview control that displays, EmployeeId

Notice the column headers in the gridview control. They are same as the column names in the table. For example, we want a space between First and Name in FirstName. Similary, we want spaces for LastName, DateOfBirth, AnnualSalary and DepartmentName.
FirstName = First Name
LastName = Last Name
DateOfBirth = Date Of Birth
AnnualSalary = Annual Salary
DepartmentName = Department Name

To achieve this, change “HeaderText” property of the respective column, in the gridview control.

When you run the application, DateOfBirth column displays both Date and Time. I want only the “date” to be displayed. We can very easily achieve this using DataFormatString property. We have set DataFormatString=”{0:d}”, which will display short date pattern. Setting DataFormatString=”{0:D}”, will display long date pattern.

For the complete list of “Standard Date and Time Format Strings”, please visit MSDN link below.

For the annual salary column, I want to display currency symbol. For example, depending on your application requirement, you may want to display, either United States dollar ($), Great British Pound(£) or Indian Rupee Symbol. To achieve this use currency format string “0:c”. If you want to display 2 decimal places using “0:c2”

For the complete list of “Standard Numeric Format Strings”, please visit MSDN link below.

Currency symbol will be displayed, based on the default culture setting. For example,
If your default culture setting is “en-US”, United States Dollar symbol will be displayed
If your default culture setting is “en-GB”, Great British Pound symbol will be displayed
If your default culture setting is “en-IN”, Indian Rupee symbol will be displayed

Culture can be specified in web.config using globalization element’s culture attribute.

It is possible to override culture setting on a page-by-page basis. To set the culture declaratively in the aspx page, use “Culture” attribute of the “Page” directive.

To override the culture programmatically
System.Threading.Thread.CurrentThread.CurrentCulture = new System.Globalization.CultureInfo(“en-GB”);

Enjoyed this video?
"No Thanks. Please Close This Box!"