How to add Drop down list in Gridview in Asp.net

As previous discussions you have to bind data with Gridview.

In this articles I am using 2 tables, Bank Table and Cheque Table

Bank Table
---------------
b_code int
b_name nchar(50)

Cheque Table
-----------------
ch_no nchar(10)
ch_bank int


For data binding to Gridview use below SQL query

SELECT Cheques.ch_no, Banks.b_name FROM Banks INNER JOIN Cheques ON Banks.b_code = Cheques.ch_bank ORDER BY Banks.b_name


After data bind as above, Gridview Shows 2 columns Cheque No. and Bank name.

As next step I am going to add Template filed

and drag and drop Dropdown list control to Gridview Item Template, as the normal way you have to bind data to dropdown list.

I used bank Table for bind data to dropdown list as below SQL query

SELECT [b_code], [b_name] FROM [Banks] ORDER BY [b_name]

For Select a data field to display in the DropDownList used Bank name (b_name) field from Bank Table and Select a data field for the value of the DropDownList used Bank code (b_code) field from Bank Table.

End the template field editing and view the browser.

You can see the dropdown list for each and every row. When you click on dropdown list you can see the bank names list and you can select the bank name.

Note :
-------
In this Gridview have 3 columns Cheque No., Bank name as label and Bank name as Dropdown List.
But Dropdown list showing "-" for every row. When binding data to Gridview how to select the bank name from Dropdown list.

There are 2 ways to do this, without using coding and using coding (VB & C#)

I ma going to explain in next articles.

Read More

How to merge Gridview header cells C#

In this article I am going to explain How to merge Gridview header cells with C#

As I explained in previous articles bind data with Gridview, If you are new to this article series, please visit How to bind data with Gridview

After bind data Gridview headings shows as below

|    #     |        Name        |     Code    |

I am going to inset an another row above to this headings as below

|  Cheque |                 Bank                  |
----------------------------------------------
|      #       |        Name        |     Code    |


Cheque header column is one cell and Bank header as with 2 cells merged.

Use the below mentioned code inside the RoeDataBound event.

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {

 GridViewRow gvr = e.Row;

        if (gvr.RowType == DataControlRowType.Header)
        {
            GridViewRow row = new GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Normal);

            TableCell cell = new TableCell();
            cell.ColumnSpan = 1;
            cell.HorizontalAlign = HorizontalAlign.Center;
            cell.Text = "Cheque";
            row.Cells.Add(cell);

            cell = new TableCell();
            cell.ColumnSpan = 2;
            cell.HorizontalAlign = HorizontalAlign.Center;
            cell.Text = "Bank";
            row.Cells.Add(cell);

            GridView1.Controls[0].Controls.AddAt(0, row);
        }

}

Please watch video for more details.

Read More

How to merge cells in Gridview C#

In this article I am going to explain how to merge cells in Gridview.

If field data is repeating row wise, when we bind data with Gridview, same record is show more times in Gridview as below. 

123456  Commercial Bank PLC

345632  Commercial Bank PLC

378912  Commercial Bank PLC

I am going to show one record for repeating data as below.

123456  

345632  Commercial Bank PLC

378912  

As previous articles we have to drag and drop Griview controller to design form and bind data using data source.

Open the Gridview RoDataBound event and past the below coding

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        for (int rowIndex = GridView1.Rows.Count - 2; rowIndex >= 0; rowIndex--)
        {
            GridViewRow row = GridView1.Rows[rowIndex];
            GridViewRow previousRow = GridView1.Rows[rowIndex + 1];
            if (row.Cells[1].Text == previousRow.Cells[1].Text)
            {
                row.Cells[1].RowSpan = previousRow.Cells[1].RowSpan < 2 ? 2 :
                                             previousRow.Cells[1].RowSpan + 1;
                previousRow.Cells[1].Visible = false;
            }
        }
    }

I have explain this Gridview cell merge with VB also Click hear

Read More

How to merge cells in Gridview VB

In this article I am going to explain how to merge cells in Gridview.

If field data is repeating row wise, when we bind data with Gridview, same record is show more times in Gridview as below. 

123456  Commercial Bank PLC

345632  Commercial Bank PLC

567890  Commercial Bank PLC

I am going to show one record for repeating data as below.

123456  

345632  Commercial Bank PLC

567890  

As previous articles we have to drag and drop Griview controller to design form and bind data using data source.

Open the Gridview RoDataBound event and past the below coding

 Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

        For rowIndex As Integer = GridView1.Rows.Count - 2 To 0 Step -1

            Dim gviewRow As GridViewRow = GridView1.Rows(rowIndex)

            Dim gviewPreviousRow As GridViewRow = GridView1.Rows(rowIndex + 1)

            For cellCount As Integer = 0 To gviewRow.Cells.Count - 1

                If gviewRow.Cells(cellCount).Text = gviewPreviousRow.Cells(cellCount).Text Then

                    If gviewPreviousRow.Cells(cellCount).RowSpan < 2 Then

                        gviewRow.Cells(cellCount).RowSpan = 2

                    Else

                        gviewRow.Cells(cellCount).RowSpan = gviewPreviousRow.Cells(cellCount).RowSpan + 1

                    End If

                    gviewPreviousRow.Cells(cellCount).Visible = False

                End If

            Next

        Next

    End Sub

Read More

How to show Gridview inside another Gridview

In this article I am going to explain how to Show Gridview inside a another Gridview

As the first step need to drag and drop a Gridview to design form and bind data as I have discussed in How to bind data with Gridview.
Next add template column as we discount in How to add Template column in Gridview.

We have to add a label to Item Template and bind data. Click on Label control and go to Edit data binding and bind the data field with field binding bound to. Then drag and drop another Gridview inside to Item Template and bind data.

Important thing is data source query. need to pass parameter to data source. We have to pass the value to data source from main Gridview template column.

Now you can see row wise data with related data with a another Gridview.

Read More

How to Add Template Column in Gridview

How to Add Template Column in Gridview

In this article I am going to explain, how to add template column in Gridview. As previous articles what I have explained as you have to drag and drop Gridview control to form. and bind SQL table with data source.

As showing in above image click on Gridview right hand side arrow, then pop menu will display, in the next step click on Add new Column.

and choose a field type from the dropdown list as TemplateField and input header in Header text box.
Press OK for apply the changes, new Template column will displayed in Grdview.

But still this Template column not bind with data field.

Bind data with Template column

Right click on the Gridview right hand side arrow, then menu will displayed and you have to select Edit Template.

Then you can see a sub menu with template column. click on the Template column.

Drag and drop Label to inside of Item Template and bind data

Clink on Label and Label Task menu will display, in this menu click on Edit binding, then above screen will display. Select the field name from Field binding and press OK.


Open with browser and you can see the bind data with template column.

Read More

How to delete row in Gridview using C#

Watch Video

In this article I am going to explain how to delete row in Gridview using C# code.

Drag and drop GRiview controller to form and using data source bind data to Gridview.

Click on the Gridview and you can see arrow top right. When you click on arrow pop menu will display named as Gridview Tasks.

In that Gridview Task menu, you have to check the Enable Selection, and click on the Edit column. Next change the text on SelectedText as Delete. Then you can see the first column as Delete.

Next click on Gridview and go to properties and click Even icon, then you can see all events of Gridview.

From that event list go to SelectIndexChanges and double click. Then SelectIndexChanged event coding window will display and you can write the code as below

protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
    {
        GridViewRow row = GridView1.SelectedRow;
        txtBcode.Text = row.Cells[1].Text;
        txtBname.Text = row.Cells[2].Text;

        SqlConnection sqlConnection1 = new SqlConnection("Data Source=SERVER;Initial Catalog=SUPERMARKET;Integrated Security=True");

        SqlCommand cmd = new SqlCommand();
        cmd.CommandType = System.Data.CommandType.Text;
        cmd.CommandText = "DELETE Banks WHERE b_code =" + int.Parse(txtBcode.Text) + "";
        cmd.Connection = sqlConnection1;

        sqlConnection1.Open();
        cmd.ExecuteNonQuery();
        sqlConnection1.Close();

        GridView1.DataBind();

    }


Creating the SQL connection string as below

 SqlConnection sqlConnection1 = new SqlConnection("Data Source=SERVER;Initial Catalog=SUPERMARKET;Integrated Security=True");


After getting the SQL connection string and Open the SQL connection. As the next step execute the SQL Command for Deleting Record from SQL Table, and Bind the data source again to Gridview.

Actually Gridview row not deleteing from Gridview. Record deleting from SQL Database Table record and SQL Database Table again bind with Gridview using Data source.

Run the project and you can see data with Gridview with first column as Delete. when you click on Delete link button. Selected row will delete.

Watch Video

• How to create new project visual studio 2010

• How to bind data with GridView

• How to filter Gridview with Dropdownlist in Asp.net

• How to bind data with dropdownlist

• How to insert data to table using button click

• How to bin data with Gridview using VB code

Read More

How to delete row in Gridview using VB code

Watch Video

In this article I am going to explain how to delete row in Gridview using VB code.

Drag and drop GRiview controller to form and using data source bind data to Gridview.

Click on the Gridview and you can see arrow top right. When you click on arrow pop menu will display named as Gridview Tasks.

In that Gridview Task menu, you have to check the Enable Selection, and click on the Edit column. Next change the text on SelectedText as Delete. Then you can see the first column as Delete.

Next click on Gridview and go to properties and click Even icon, then you can see all events of Gridview.

From that event list go to SelectIndexChanges and double click. Then SelectIndexChanged event coding window will display and you can write the code as below

Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles GridView1.SelectedIndexChanged
        Dim row As GridViewRow = GridView1.SelectedRow
        txtBCode.Text = row.Cells(1).Text
        txtBname.Text = row.Cells(2).Text

        Dim myConnection As SqlConnection = New SqlConnection(GetConnectionString)
        Dim myCommand As SqlCommand
        myConnection.Open()

        myCommand = New SqlCommand("DELETE Banks WHERE b_code =" & Val(txtBCode.Text), myConnection)
        myCommand.CommandType = CommandType.Text
        myCommand.ExecuteNonQuery()

        myConnection.Close()

        GridView1.DataBind()
    End Sub


Creating the SQL connection string as below

  Dim myConnection As SqlConnection = New SqlConnection(GetConnectionString)

GetConnectionString will com form Class1,vb Clase

Public Shared Function GetConnectionString() As String

        GetConnectionString = ConfigurationManager.ConnectionStrings("SUPERMARKETConnectionString").ConnectionString
        Return GetConnectionString
    End Function


SUPERMARKETConnectionString is getting from Web.config file

<connectionStrings>
    <add name="SUPERMARKETConnectionString" connectionString="Data Source=SERVER;Initial Catalog=SUPERMARKET;Integrated Security=True"
      providerName="System.Data.SqlClient" />
  </connectionStrings>

After getting the SQL connection string and Open the SQL connection. As the next step execute the SQL Command for Deleting Record from SQL Table, and Bind the data source again to Gridview.

Actually Gridview row not deleteing from Gridview. Record deleting from SQL Database Table record and SQL Database Table again bind with Gridview using Data source.

Run the project and you can see data with Gridview with first column as Delete. when you click on Delete link button. Selected row will delete.

Watch Video

• How to create new project visual studio 2010

• How to bind data with GridView

• How to filter Gridview with Dropdownlist in Asp.net

• How to bind data with dropdownlist

• How to insert data to table using button click

• How to bin data with Gridview using VB code

Read More

How to display mouseover effect in GridView rows C#

Data bind Gridview as previous projects. Watch Video

Click on the Gridview and open the property windows and click on Event icon.

Double click on RowCreated Event, coding window will open. and past the below code.

 protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {
        decimal RowValue = default(decimal);
        RowValue = decimal.Remainder(e.Row.RowIndex, 2);

        if (!(e.Row.RowIndex == -1))
        {
            e.Row.Attributes.Add("OnMouseOver", "this.style.backgroundColor = 'lightsteelblue';");

        }

        if (RowValue == 0 & !(e.Row.RowIndex == -1))
        {
            e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor = '';");

        }
        else if (!(RowValue == 0) & !(e.Row.RowIndex == -1))
        {
            e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor = '';");

        }
    }


Watch Video

Read More

How to display mouseover effect in GridView rows VB

Data bind Gridview as previous projects. Watch Video

Click on the Gridview and open the property windows and click on Event icon.

Double click on RowCreated Event, coding window will open. and past the below code.

 Protected Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated
     
        Dim RowValue As Decimal
        RowValue = Decimal.Remainder(e.Row.RowIndex, 2)

        If Not e.Row.RowIndex = -1 Then
            e.Row.Attributes.Add("OnMouseOver", "this.style.backgroundColor = 'lightsteelblue';")

        End If

        If RowValue = 0 And Not e.Row.RowIndex = -1 Then
            e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor = '';")

        ElseIf Not RowValue = 0 And Not e.Row.RowIndex = -1 Then
            e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor = '';")

        End If
    End Sub


Watch Video

Read More

How to insert data to table using button click C#

In this article I am going to explain How to insert data to table using button click event with C#

First you have to create a new web project as we discussed earlier article. How to create new project with visual studio. 

Watch Video

I am going to user how to bind data with dropdownlist for this project also.

First we have to design screen layout, Text box and Button controller as the previous projects, you have to drag and drop controllers from toolbox to designing form.

Next you can change the ID from properties and double click on the Button controller
then button Click even coding screen will display.

You have to type the coding as displayed below.

using System.Data.SqlClient;

Coding for Button Click event

protected void btnSave_Click(object sender, EventArgs e)
    {
        SqlConnection sqlConnection1 = new SqlConnection("Data Source=SERVER;Initial Catalog=SUPERMARKET;Integrated Security=True");

        SqlCommand cmd = new System.Data.SqlClient.SqlCommand();
        cmd.CommandType = System.Data.CommandType.Text;
        cmd.CommandText = "INSERT Banks (b_name) VALUES ('" + txtBname.Text + "')";
        cmd.Connection = sqlConnection1;

        sqlConnection1.Open();
        cmd.ExecuteNonQuery();
        sqlConnection1.Close();

        GridView1.DataBind();
    }

Finally run the application and you can input name for text box and press Save button. Then bank name with save to SQL table.

For details Watch Video

Read More

Why Should You Move to Visual Studio 2010?

There are various motivations to move to Visual Studio 2010 Professional, and before we jump into the book parts to analyze them, we thought it is great to list a couple from a highlevel point of view (introduced with no need requesting):

Rich, new proofreader with worked in Windows Presentation Foundation (WPF) that you can profoundly redo to suit how you function.

New Quick Search, which finds pertinent outcomes just by rapidly writing the initial couple of letters of any strategy, class, or property.

Awesome help for creating and sending Microsoft Office 2010, SharePoint 2010, and Windows Azure applications.

Multi-core improvement bolster that enables you to parallelize your applications, and another particular debugger to enable you to track the errands and strings

Upgrades to the ASP.NET AJAX system, center JavaScript IntelliSense bolster, and the incorporation in Visual Studio 2010 of jQuery, the open-source library for DOM associations.

Multi-targeting/multi-framework bolster. Read Scott Guthrie's blog entry to get a comprehension of this incredible element

Support for creating WPF and Silverlight applications with upgraded dragand-drop support and information authoritative. This incorporates incredible new upgrades to the creators, empowering a higher loyalty in rendering your controls, which thusly empowers you to find bugs in rendering before they occur at run time (which is an awesome change from past variants of Visual Studio). New WPF and Silverlight apparatuses will help you to explore the visual tree and assess protests in your rich WPF and Silverlight applications.

Awesome help for Team Foundation Server (TFS) 2010 (and past renditions) utilizing Team Explorer. This empowers you to utilize the information and reports that are consequently gathered by Visual Studio 2010 and track and break down the soundness of your undertakings with the coordinated reports, and additionally keep your bugs and errands exceptional.

Coordinated help for test-driven advancement. Programmed test stub era and a rich unit test system are two decent test highlights that designers can exploit for making and executing unit tests. Visual Studio 2010 has extraordinary extensibility indicates that will empower you additionally utilize basic outsider or open-source unit test systems specifically inside Visual Studio 2010.

Be that as it may, the most vital explanation behind numerous designers and ventures to make the move is to have the capacity to focus on the genuine issues they're confronting as opposed to investing their energy translating code. You'll see that with Visual Studio 2010 you can take care of those issues speedier. Visual Studio 2010 gives you new, capable outline surfaces and effective apparatuses that assistance you compose less code, compose it quicker, and convey it with higher quality.

Read More

How to Select record from Gridview using C#

I this article I am going to explain how to select record from Gridview using C# code.

As previous article, you have to create a new project.

How to create new project with Visual Studio

Watch Video

Also I have explained how to bind data with Gridview

How to bind data with Gridview

Watch Video

Design screen for Bank code and Bank name using Labels and Text Boxes. give them IDs as Bank Code as txtBcode and Bank Name as txtBname

Click on the Gridview and you can see arrow top right. When you click on arrow pop menu will display named as Gridview Tasks.

In that Gridview Task menu, you have to check the Enable Selection.

Then you can see new column added to Gridview and show Select for every row with Blue colour.

Next click on Gridview and go to properties and click Even icon, then you can see all events of Gridview.

From that event list go to SelectIndexChanges and double click. Then SelectIndexChanged event coding window will display and you can write the code as below

protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
    {
        GridViewRow row = GridView1.SelectedRow;
        txtBcode.Text = row.Cells[1].Text;
        txtBname.Text = row.Cells[2].Text;
    }


Run the project and you can see data with Gridview and first column as select. when you click on select link button. selected row bank code and bank name displayed on Bank code textbox and Bank name text box.

Watch Video

• How to create new project visual studio 2010

• How to bind data with GridView

• How to filter Gridview with Dropdownlist in Asp.net

• How to bind data with dropdownlist

• How to insert data to table using button click

• How to bin data with Gridview using VB code

Read More