Solved

How highlight gridview row when enter textbox?

Posted on 2011-03-15
9
585 Views
Last Modified: 2012-06-27
I have a gridview with 1 data entry textbox and a few additional "read-only" columns. Whenever I put the cursor in the textbox I want to highlight the gridview row. On "exit" of the textbox I want to unhighlight it. How can I do this? Here's how the field is setup currently. As you can see I figured out how to link the txtUnitPrice_TextChanged code behind to the textbox so far...

<asp:TemplateField HeaderText="Unit Price" ItemStyle-Width="100px">
                <ItemTemplate>
                    $<asp:TextBox CausesValidation="true" CssClass="bf_textbox" ID="txtUnitPrice" AutoPostBack="true" runat="server" OnTextChanged="txtUnitPrice_TextChanged" Width="82px"></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateField>
0
Comment
Question by:RobertNZana
  • 5
  • 4
9 Comments
 
LVL 9

Expert Comment

by:Roman Gherman
ID: 35139381
Hi,
you can use jquery to do that

$<asp:TextBox CausesValidation="true" CssClass="bf_textbox" ID="txtUnitPrice" AutoPostBack="true" runat="server" OnTextChanged="txtUnitPrice_TextChanged" Width="82px" onfocus="$(this).parent('tr').toggleClass('HIGHLIGHTCLASS');" onblur='$(this).parent('tr').toggleClass('HIGHLIGHTCLASS');' ></asp:TextBox>

You can find me on:http://extremedev.blogspot.com
0
 
LVL 9

Author Comment

by:RobertNZana
ID: 35140381
I get this...

Parser Error Message: Type 'AjaxControlToolkit.ValidatorCalloutExtender' does not have a public property named 'onfocus'.
0
 
LVL 9

Author Comment

by:RobertNZana
ID: 35140441
Never mind. Wrong control. LOL

I put it in so it's like this, but it doesn't work. Do I need additional css, js, etc... files?

 <asp:TextBox CausesValidation="true" CssClass="bf_textbox" ID="txtUnitPrice" AutoPostBack="true"
                        runat="server" OnTextChanged="txtUnitPrice_TextChanged" Width="82px" onfocus="$(this).parent('tr').toggleClass('HIGHLIGHTCLASS');" onblur='$(this).parent('tr').toggleClass('HIGHLIGHTCLASS');'></asp:TextBox>
                   
0
 
LVL 9

Expert Comment

by:Roman Gherman
ID: 35141128
Hi, you need to create a HIGHLIGHTCLASS css class that will change the color of the row.

For example:

<style type="text/css">
.HIGHLIGHTCLASS
{
background-color:Red;
}
</style>

You can find me on:http://extremedev.blogspot.com
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 9

Expert Comment

by:Roman Gherman
ID: 35141170
here is the complete code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

    <style type="text/css">
        .HIGHLIGHTCLASS
        {
            background-color: Red;
        }
    </style>
</head>
<body>
    <table width='500px'>
        <tr>
            <td>
                <input type="text" value='t' onfocus="$(this).parents('tr').toggleClass('HIGHLIGHTCLASS');"
                    onblur="$(this).parents('tr').toggleClass('HIGHLIGHTCLASS');" />
            </td>
        </tr>
        <tr>
            <td>
                test
            </td>
        </tr>
    </table>
</body>
</html>

Open in new window


Note: you will have to make some changes:
1) add the class
2) onblur="..." instead of onblur='...'
3) change parent to parents

You can find me on:http://extremedev.blogspot.com
0
 
LVL 9

Author Comment

by:RobertNZana
ID: 35141253
Thanks. The example you provided works but mine doesn't.

Remember the textbox is in a ItemTemplate within a gridview. See my initial code example. Right now this doesn't seem to work in my case.
0
 
LVL 9

Expert Comment

by:Roman Gherman
ID: 35141381
hhmmm, strange.

It is possible that you are doing something wrong.
0
 
LVL 9

Author Comment

by:RobertNZana
ID: 35141388
That's always possible but I double checked. Can you use a gridview in your example? You can just bind a simple datatable to it.
0
 
LVL 9

Accepted Solution

by:
Roman Gherman earned 500 total points
ID: 35141573
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="MyBlogArticles.temp.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <style type="text/css">
        .HIGHLIGHTCLASS
        {
            background-color: Red;
        }
        .bf_textbox
        {
            background-color:Yellow;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server">
        <Columns>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:TextBox CssClass="bf_textbox" ID="txtUnitPrice" AutoPostBack="true"
                        runat="server" Width="82px" 
                        onfocus="$(this).parents('tr').toggleClass('HIGHLIGHTCLASS');" 
                        onblur="$(this).parents('tr').toggleClass('HIGHLIGHTCLASS');"></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
        </asp:GridView>
    </div>
    </form>
</body>
</html>

Open in new window


You can find me on:http://extremedev.blogspot.com
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This is a video that shows how the OnPage alerts system integrates into ConnectWise, how a trigger is set, how a page is sent via the trigger, and how the SENT, DELIVERED, READ & REPLIED receipts get entered into the internal tab of the ConnectWise …
A company’s greatest vulnerability is their email. CEO fraud, ransomware and spear phishing attacks are the no1 threat to a company’s security. Cybercrime is responsible for the largest loss of money to companies today with losses projected to r…

919 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now