how to display data in the GridView from the Database Table Emp

This article explains how to display data in the GridView from the Database Table Emp.

Let us first assume that We have a database Table Emp with columns EmpId,EmpName,EmpSal in the database CompanyDB.

Requirement: To display the Employee details from the Emp table in the GridView.

Step1: Creating a new Website: GridViewDemo

a.     Open Visual Web Developer or VisualStudio 2008.

b.     On the File menu, click New Website, In the Dialog box that appears Under VisualStudioInstalled templates  select ASP.NET Website.

c.     Then Type the location (Foldername) where you want to create your website such as D:\GridViewDemo in the second location box.

d.     Select the language you want to create website in. Let us select C#.

e.     Click ok , This will create a website with name GridViewDemo. This website by default contains a Webpage named Default.aspx.

Step2:  Adding GridViewControl to display data.

a.     Open the Default.aspx page. 

b.     Go to View Menu -> Select Toolbox -> From the Toolbox window ->Under Data section Double click on Gridview or Drag and Drop the GridView from the Toolbox onto the Default.aspx page.

c.     In VisualStudio /Visual WebDeveloper, switch to Design view . Right click the GridView control  and then click on ShowSmartTag -> This displays a small button with an arrow (>) on the extreme right-top of the gridivew(SmartTag).

d.     select the smart tag, this will open the gridiview tasks menu, in the choose datasource list click the dropdown and select  New Datasource. The Data Source configuration dialog box appears.

e.     Click Database->This specifies that you want to fetch data from database. In the Specify an ID for the data source textbox, a default data source control name appears (SqlDataSource1).

f.        Click Ok.

g.     The Configure Data Source Wizard appears, which displays a page on which you can choose a connection to the database.

h.      Click New connection . In the Add Connection Window. Change the Data Source to Microsoft SQL Server.

i.         The servername should be database server name. If it is the localsystem on which you are trying to connect to the database. Usually it is .\SQLEXPRESS. Where . (dot)here represents the current machine name. SQLEXPRESS is the database server instance name.

j.         Tip: How to find the Database server Instance name:  (StartMenu->All Programs->Administrative Tools->Service->In the services window search for service with the name SQL  Server. Beside this you will find Database Server instance name in paranthesis(generally it is SQL EXPRESS). This name is the Server name which has to be specified in the above Add connection window after “.\”

k.      Let the Windows authentication be selected for log in and connecting to the database or if required you can type the username and password. Then select the database from which you want to display the data.

l.         The Emp table is present in CompanyDB database so I selected CompanyDB here.

m.    Click Next.

n.      The wizard appears, displaying a page on which you can choose to store the connection string in the configuration file

o.     Click Next again.

p.     Under Specify columns from a table or view, in the Name list, click Emp

q.     Under Columns, select the EmpId,EmpName, EmpSal checkboxes.

r.        This window also displays the SQL statement that you are creating in a box at the bottom of the window.

s.       Click Next and then Click Test Query to make sure that you are fetching the data you want.

t.         Click on finish.

u.      Press CTRL + F5 to execute the Default page.

v.     The Webpage (Default.aspx page) appears in the webbrowser which shows The Gridview displaying all the datarows from the Emp table of CompanyDB database.

Conclusion: In this article we have seen how to fetch selectted data from the SQLSERVER database and display in the GridView.