Making an entire cell of a table respond to a click.

Discussion in 'ASP .Net' started by Mufasa, Aug 13, 2007.

  1. Mufasa

    Mufasa Guest

    I have cell that I want to be able to have the user click the cell anywhere
    and it will link to somewhere else. I want to use a cell because I want it
    to be 25% of the width of the screen ( I have 4 'buttons' to do this.) I
    don't want to use a graphic because I want it to be able to resize.

    Any suggestions?

    In a perfect world, I'd also like to have it change color when somebody goes
    over it.

    TIA - Jeff.
     
    Mufasa, Aug 13, 2007
    #1
    1. Advertisements


  2. <td style="cursor:pointer;" onclick="location.href='page2.aspx';"
    onmouseover="this.style.backgroundColor='Green';"
    onmouseout="this.style.backgroundColor='White';">
     
    Mark Rae [MVP], Aug 13, 2007
    #2
    1. Advertisements

  3. Mufasa

    Mufasa Guest

    That works great!

    Is there anyway to automate it into a CSS or some othere way so I don't have
    to do it every single time?

    TIA - Jeff.
     
    Mufasa, Aug 13, 2007
    #3
  4. <td style="cursor:pointer;" onclick="location.href='page2.aspx';"
    So that's how you do this sort of thing in ASP.NET 2.0, huh? Looks an awful
    lot like plain old HTML to me.

    How do you go about implementing this sort of thing "cleanly" for server
    controls that ultimately generate tables, such as a calendar or gridview?
     
    Homer J. Simpson, Aug 13, 2007
    #4
  5. Mufasa

    John Mott Guest

    You can only put styles (the cursor in this case) in css, the events
    (onmouseover, onmouseout, onclick) must appear in a tag somewhere. The
    location change is a javascript so it can't go in a style sheet either.

    However, you can put the different styles into a css class and do this:

    <style>
    ..overClass {background-color: Green}
    ..outClass {background-color:White}
    </style>
    <td onmouseover="this.className='overClass'"
    onmouseout='this.className='outClass'> content </td>

    John
    nice clean examples at www.nicecleanexample.com


     
    John Mott, Aug 13, 2007
    #5
  6. Mufasa

    John Mott Guest

    When generating table cells on the server you'd set the appropriate
    attributes, as in:

    TableCell td = new TableCell();
    td.Attributes.Add("onmouseover","this.style.backgroundColor='Green'");

    John
    nice clean examples at www.nicecleanexample.com
     
    John Mott, Aug 13, 2007
    #6
  7. Mufasa

    Mufasa Guest

    Thanks for all the info.

    Jeff.

     
    Mufasa, Aug 14, 2007
    #7
  8. <td style="cursor:pointer;" onclick="location.href='page2.aspx';"
    Yeah, that's obvious enough if you're building the controls yourself--but
    the crux of my question had to do with server controls that don't easily
    give you access to the individual rows or cells. How would you go about
    implementing, for example, an onclick event for the month name in a calendar
    control? As far as I can see, the calendar object doesn't have a member
    mapped to that particular <td>, and looking at the raw HTML output, it has
    no ID either.

    So under those circumstances, is "the best way" to hook up an event to try
    to locate the correct cell by its position in the control collection--which
    makes your code highly susceptible to break?
     
    Homer J. Simpson, Aug 14, 2007
    #8
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.