How to Bind GridView with SqlDataSource and use DataBoundField

Bind GridView with SqlDataSource and use DataBoundField to display and update data

Here is an example of how to use Sql Data Source with Grid View while working with Data Bound Field in Grid View

We can bind  Grid view with database using TemplateField and Bound Field.

In this example I am using  Bound Field to bind data with Grid View.

Bound Field is by default behaviour of Grid View and easy to use.

we can not add any coutom information or column in Grid view using Data Bound Field, but using Template Field we can add custom cloumn in Grid view.

In this example I am binding Grid View with Sql Data Source using Data Bound Field

I have used one database table in my  example named tbemp. Script to create  table is given below. Run this script in your query analyzer window in using your database.

CREATE TABLE tbemp

(

    eno int NULL ,

    ename varchar (50) NULL,

    eadd varchar (50) NULL,

    esal int NULL

)

GO

Now create a page named GridView.aspx

Add a SqlDataSource control on your design page
Set SqlDataSource Control’s ConnectionString Property as below

Data Source=your_server_name;Initial Catalog=your_database_name;Integrated Security=True
 

Change your_server_name with your server name
Chage your_database_name with database which has table tbemp

Now go to Property named SelectQuery and click on button next to it (button with dots on it) and writ the following query
SELECT * FROM [tbemp]

Now go to Property named UpdateQuery and click on button next to it (button with dots on it) and writ the following query
update tbemp set ename=@ename,eadd=@eadd,esal=@esal where eno=@eno
and click on Refersh Parameter button

Now go to Property named DeleteQuery and click on button next to it (button with dots on it) and writ the following query
delete from tbemp where eno=@eno
and click on Refersh Parameter button

Now Drag and drop a Grid View Control on your desing page and set its Properties as below
AutoGenerateDeleteButton="True"
AutoGenerateEditButton="True"
DataKeyNames="eno"
DataSourceID="SqlDataSource1"

 
Now make cloumn named eno to read only as below
Go to Grid View ‘s Property named columns and click on button next ot it
Select eno under selected field section
Find read only property of eno under BoundField Properties section and set it to true

Or you can use code given below and modify connection string of sql data source
   
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
            AutoGenerateDeleteButton="True" AutoGenerateEditButton="True"
            AutoGenerateSelectButton="True" DataKeyNames="eno"
            DataSourceID="SqlDataSource1">
            <Columns>
                <asp:BoundField DataField="eno" HeaderText="eno" ReadOnly="True"
                    SortExpression="eno" />
                <asp:BoundField DataField="ename" HeaderText="ename" SortExpression="ename" />
                <asp:BoundField DataField="eadd" HeaderText="eadd" SortExpression="eadd" />
                <asp:BoundField DataField="esal" HeaderText="esal" SortExpression="esal" />
            </Columns>
        </asp:GridView>
        <br />
    <asp:SqlDataSource ID="SqlDataSource1" runat="server"
        ConnectionString="<%$ ConnectionStrings:cn %>"
        DeleteCommand="delete from tbemp where eno=@eno"
        SelectCommand="SELECT * FROM [tbemp]"
        UpdateCommand="update tbemp set ename=@ename,eadd=@eadd,esal=@esal where eno=@eno">
        <DeleteParameters>
            <asp:Parameter Name="eno" />
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Name="ename" />
            <asp:Parameter Name="eadd" />
            <asp:Parameter Name="esal" />
            <asp:Parameter Name="eno" />
        </UpdateParameters>
    </asp:SqlDataSource>
   
Now run the application

no fear choudhary is here, Saturday, July 03, 2010