ASP.NET - grid row color change when click - Asked By msakt on 09-May-12 01:24 AM

<AlternatingRowStyle CssClass="GVAltRow" />

this is for grid row color change when click edit..but this show previous edit row only..now i want edit one row cuurent row color change
Jitendra Faye replied to msakt on 09-May-12 01:31 AM
Use this code-

protected void grdCustomerDetail_RowCreated(object sender, GridViewRowEventArgs e)
      {
        try
        {
          if (e.Row.RowType == DataControlRowType.DataRow)
          {
            e.Row.Attributes.Add("click", "changecolor(this);");
          }
        }
        catch (Exception ex)
        {
          UIHelper.PrintMessage(this, ex.Message);
        }
      }

NOw use this Javascript function-


//Function to change color of grid row on click
function changecolor(row) {
     row.style.backgroundColor = '#D3DFF8';
 }

Somesh Yadav replied to msakt on 09-May-12 02:33 AM

Following javascript will be used to change the color of the row.

        <script type="text/javascript">
        //variable that will store the id of the last clicked row
        var previousRow;
        
        function ChangeRowColor(row)
        {
            //If last clicked row and the current clicked row are same
            if (previousRow == row)
                return;//do nothing
            //If there is row clicked earlier
            else if (previousRow != null)
                //change the color of the previous row back to white
                document.getElementById(previousRow).style.backgroundColor = "#ffffff";
            
            //change the color of the current row to light yellow

            document.getElementById(row).style.backgroundColor = "#ffffda";            
            //assign the current row id to the previous row id 
            //for next row to be clicked
            previousRow = row;
        }
     </script>

Following code will be required on GridView1_RowDataBound event

    Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) _
        Handles GridView1.RowDataBound
        If (e.Row.RowType = DataControlRowType.DataRow) Then
            e.Row.Attributes.Add("onclick", "javascript:ChangeRowColor('" & e.Row.ClientID & "')")
        End If
    End Sub

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            'FillDataTable is a function that will return a DataTable
            'with some values and is available in the code for download.
            Me.GridView1.DataSource = Me.FillDataTable()
            Me.GridView1.DataBind()
        End If
    End Sub
        

Before clicking the row

After clicking the row

dipa ahuja replied to msakt on 09-May-12 04:18 AM
Add this inside the gridview :

 <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />