Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 658
  • Last Modified:

Blink Gridview Row Color - Utilizing J-Query

Please review the attached code.   I need to Blink the "Background" Color of the entire "Gridview" row based on the value of column [12] utilizing "JQuery".   I do not want to Blink the text only the background color.

public partial class BigBoardDisp : System.Web.UI.Page
{

    protected void GridView1_RowDataBound (object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
            if (e.Row.Cells[6].Text == "AOG" || e.Row.Cells[6].Equals(DBNull.Value))
            {
                e.Row.BackColor = System.Drawing.Color.Red;
            }

            else if (e.Row.Cells[6].Text == "RDY")
            {
                e.Row.BackColor = System.Drawing.Color.Aqua;
            }

            else if (e.Row.Cells[6].Text == "WKG")
            {
                e.Row.BackColor = System.Drawing.Color.LightSkyBlue;
            }

            else if (e.Row.Cells[6].Text == "INSP")
            {
                e.Row.BackColor = System.Drawing.Color.Yellow;
            }

            else if (e.Row.Cells[6].Text == "BOB")
            {
                e.Row.BackColor = System.Drawing.Color.Lime;
            }

            else if (e.Row.Cells[6].Text == "On-Time")
            {
                e.Row.BackColor = System.Drawing.Color.SpringGreen;
            }
            else if (e.Row.Cells[6].Text == "MX-Delay")
            {
                e.Row.BackColor = System.Drawing.Color.Crimson;
            }

            if (e.Row.Cells[6].Text == "AOG")
            {
            e.Row.Cells[6].Text = "<FONT class='jqueryBlink'>" + e.Row.Cells[6].Text + "</FONT>";

        }

    }

Open in new window

0
BOEING39
Asked:
BOEING39
  • 2
  • 2
1 Solution
 
Albert Van HalenAnalyst developerCommented:
Instead of putting a font tag with class in the text property of the cell, I would add a class to the row. Perhaps you can use
e.Row.CssClass="jqueryBlink"

Open in new window

After that it's up to jquery to capture the tablerows having the class and start blinking.

I created a fiddle for you : http://jsfiddle.net/j79kR/
0
 
BOEING39Author Commented:
This blinks all the row alternately.   I need code similar to that above for flashing (text) that blinks only rows meeting specific criteria without using css.   In the above examples it is utilizing "FONT" class.

For examplethe following code flashes the hyperlink column cell red/yellow based on MMCO-Open.   What I am looking for is for the entire row to blink based on a similar condition.

if (e.Row.Cells[12].Text == "MCO-Open" || e.Row.Cells[12].Text == "MMCO-Open")
        {
            HyperLink lnkMCO = (HyperLink)e.Row.Cells[1].Controls[0];
            lnkMCO.Text = "<FONT class='jqueryBlink'>" + lnkMCO.Text.ToString() + "</FONT>";
            //lnkMCO.ForeColor = Color.Red;
            lnkMCO.Style.Add("text-decoration", "none");
            e.Row.BackColor = System.Drawing.Color.Yellow;

Open in new window

0
 
Albert Van HalenAnalyst developerCommented:
In your code snippet you say that it blinks; it merely renders the rows' backgroundcolor to yellow.
If the table is updating via updatepanel it would indeed 'blink' after a partial postback. But then you don''t have to use jQuery because you render everything serverside.

I would suggest to use css rules to style the rows.

It's unclear to me what you want.
0
 
BOEING39Author Commented:
Thanks
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now