Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > ASP.NET and ASP > ASP.NET 4 > BOOK: Beginning ASP.NET 4 : in C# and VB
Password Reminder
Register
| FAQ | Members List | Search | Today's Posts | Mark Forums Read
BOOK: Beginning ASP.NET 4 : in C# and VB
This is the forum to discuss the Wrox book Beginning ASP.NET 4: in C# and VB by Imar Spaanjaars; ISBN: 9780470502211
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning ASP.NET 4 : in C# and VB section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old June 9th, 2012, 05:48 PM
Friend of Wrox
Points: 1,905, Level: 17
Points: 1,905, Level: 17 Points: 1,905, Level: 17 Points: 1,905, Level: 17
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: May 2011
Posts: 411
Thanks: 13
Thanked 7 Times in 7 Posts
Default A new Jquery trick and a treat for Imar and everyone else.

Not too long ago, I asked you (Imar) in a posting here in this forum how to created a highlighted row on a Gridview on the mouseover event. You told me to go figure it out yourself. Well, guess what? .............

I did. Here is the code:
Code:
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Recipe1.aspx.cs" Inherits="_Default" StylesheetTheme="Standard" %>
<!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">
    <title>Chapter 3 - Recipe 1: Highlighting rows / cells of GridView on hover</title>
    <script src="js/jquery-1.4.1.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function() {
                //Use below for highlighting rows on hover
                $("#<%=GridView1.ClientID%> tr").hover(
                function() {
                    $(this).addClass("highlight");
                },
                function() {
                    $(this).removeClass("highlight");
                });
                //Use below for highlighting cells on hover
                /*$("#<%=GridView1.ClientID%> td").hover(
                     function() {
                         $(this).addClass("highlight");
                     },
                     function() {
                         $(this).removeClass("highlight");
                     }
            ); */   
        });
    </script>
    <style media="screen" type="text/css">
    .header
    {
    	background-color:Gray;
    	font-weight:bold;
    	color:White;
    	text-align:center;
    }
    .highlight
    {
    	background-color:#9999FF;
    }
    td { cursor:pointer;}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div align="center">
    <fieldset style="width:400px;height:230px;">
    <table border="0" cellpadding="3" cellspacing="3">
       <tr><td colspan="2" class="header">BOOK CATALOG</td></tr>
        <tr>
            <td colspan="2">
                <asp:GridView ID="GridView1" SkinID="Professional" runat="server">
                </asp:GridView>
            </td>
        </tr>
    </table>
    </fieldset>
    
</div>
    </form>
</body>
</html>
I don't you might want to consider using it for your new book or something or if anybody else is curious on learning how to do this Jquery trick, well here it is. Thanks again :-)
Reply With Quote
  #2 (permalink)  
Old June 9th, 2012, 06:32 PM
Imar's Avatar
Wrox Author
Points: 70,322, Level: 100
Points: 70,322, Level: 100 Points: 70,322, Level: 100 Points: 70,322, Level: 100
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Utrecht, Netherlands.
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Nice... You can make this slightly cleaner by using toggleClass and a mouse out function in the call to hover, as explained here: http://imar.spaanjaars.com/549/how-d...e-using-jquery

I won't cover this in my new book as this is a book on ASP.NET, not jQuery. The jQuery examples from the book are hopefully enough to get people motivated to experiment further....

Cheers,

Imar
__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Sys is undefined - Imar Imar Help me!! irProject BOOK: Beginning ASP.NET 4 : in C# and VB 3 March 1st, 2012 07:47 AM
to treat xml as string anboss XSLT 5 July 13th, 2008 10:45 AM
java applet trick convet to c# chall3ng3r General .NET 0 February 8th, 2005 11:22 PM
My stylesheet treat!! freezotic BOOK: Beginning Java 2 1 March 26th, 2004 04:30 PM



All times are GMT -4. The time now is 06:28 AM.


Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.