ASP .NET RowDataBound attribute working for only one row (first one)

I want to blink selected rows in gridview. I’m using a jquery and binding it to ID attribute under RowDataBound method.

But only one row (first one) is blinking, even if there are multiple rows set to blink.

Here is the HTML body

    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager" runat="server" />
        <div>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <fieldset>
                        <div>
                            <asp:GridView  ID="GrdScreen1" runat="server" OnRowDataBound="GrdTaskDetail_RowDataBound" AutoGenerateColumns="false">
                                <Columns>
                                    <asp:TemplateField HeaderText="Shift">
                                        <ItemTemplate>
                                            <asp:Label ID="testblinklbl" runat="server" Text='<%# Eval("Shift") %>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="TaskName">
                                        <ItemTemplate>
                                            <asp:Label ID="testemplbl" runat="server" Text='<%# Eval("TaskName") %>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="IsBlinkON">
                                        <ItemTemplate>
                                            <asp:Label ID="testblklbl" runat="server" Text='<%# Eval("ToBlink") %>'></asp:Label>
                                            <asp:HiddenField ID="hddblink" runat="server" Value='<%#Eval("ToBlink")%>' />  
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                            </asp:GridView>
                        </div>
                    </fieldset>
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
        </form>
    </body>

Here is the script

<script type="text/javascript">
    $(function() {
        blinkeffect('#txtblnk');
      })
   
  function blinkeffect(selector) {
      $(selector).fadeOut('slow', function() {
          $(this).fadeIn('slow', function() {
            blinkeffect(this);
          });
        });
      }
 </script>

Here is my Rowdatabound and on page load code –

protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            DataTable dt = new DataTable();
            dt = Heatcon.GetAuxcabOpDashboardScreen1("Station 1");

            if (dt.Rows.Count > 0)
            {
                GrdScreen1.DataSource = dt;
                GrdScreen1.DataBind();
            }
        }
    }

    protected void GrdTaskDetail_RowDataBound(object sender, GridViewRowEventArgs e)
    {

        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            HiddenField BlinkTask = (e.Row.FindControl("hddblink") as HiddenField);

            if (BlinkTask.Value.ToString() == "1")
            {
                e.Row.Attributes.Add("id", "txtblnk");
            }
        }
    }

This is working but only for one row (first one). I tried debugging to see if blinkvalue for other rows is getting set to “1” and it is.

Please let me know if there is something I’m missing? not sure if issue with asp gridview or jquery.
Thanks in advance!

I can provide additional details if required.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Your code is not working because you are using same “id” attribute value for more than one control. “id” value is unique for each control in page.

In order to make this work you will have to use “class” attribute. Try following changes.

<script type="text/javascript">
    $(function() {
        blinkeffect('.clstxtblnk');
      })
   
  function blinkeffect(selector) {
      $(selector).fadeOut('slow', function() {
          $(this).fadeIn('slow', function() {
            blinkeffect(this);
          });
        });
      }
</script>

Make changes to RowDataBound method to add “class” attribute instead of “id” attribute.
protected void GrdTaskDetail_RowDataBound(object sender, GridViewRowEventArgs e)
{

    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        HiddenField BlinkTask = (e.Row.FindControl("hddblink") as HiddenField);

        if (BlinkTask.Value.ToString() == "1")
        {
            e.Row.Attributes.Add("class", "clstxtblnk");
        }
    }
}


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x