How to make control visible/invisible on mouseover.

Discussion in 'ASP .Net' started by Selden McCabe, Apr 23, 2005.

  1. I have a form with a bunch of image buttons. When the user moves the mouse
    over a button, I want to do two things: 1. change the Imagebutton's picture,
    and 2. make another control visible.

    I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
    'somepicture.jpg')
    and that works fine.

    I've tried some java script to change the other control's visible property
    by changing is className, but that doesn't seem to work

    script = "document.GetElementByID('panel1').className = 'vs1';return false;"
    iBut.Attributes.Add("onMouseOver", script)

    but that gives me a script error on the page when I mouseover the image
    button. (I've tried it with and without the return false)

    So how do I change the visibility property of a control in javascript, and
    then, how do I combine two steps into one onMouseOver?

    Thanks!
    ---Selden <--- java newbie!
     
    Selden McCabe, Apr 23, 2005
    #1
    1. Advertisements

  2. Selden McCabe

    Karl Seguin Guest

    Just not that the ASP.net generates client-side ids that don't necessarily
    match the id of the control. For example, if you could have two user
    controls on the same page both containing a textbox named "username".
    ASP.Net can't output two <input type="text" tags with the same id (ie,
    "username"). Hence it must dynamically generate an id (the name of the
    textbox appended to the user control). This might be what's happening.

    Or it could simply be that it's getElementById instead of GetElementByID

    Try

    script = "document.getElementById('" & panel1.ClientId & "').className =
    'vs1'; ....."

    Karl
     
    Karl Seguin, Apr 24, 2005
    #2
    1. Advertisements

  3. Hi Karl,

    Thanks for the feedback and suggestions.
    I tried that script too, but just got a script error when I rolled the mouse
    over the button.

    I haven't gotten any other suggestions. I wonder if it's possible to write
    the routine I want in VB script instead of java? Is it any easier to access
    controls on your web page with VB script?

    Thanks,
    ---Selden
     
    Selden McCabe, Apr 25, 2005
    #3
  4. Selden McCabe

    Karl Seguin Guest

    Not really. Perhaps if you showed us what you have thus far?

    Karl
     
    Karl Seguin, Apr 25, 2005
    #4
  5. Thanks, good suggestion!

    Here's what I've tried, what worked and what didn't:

    First, there is a panel on the page, "Panel1" if I set it's CssClass to
    "vs1" it is visible. If I set it to "vs2" it is invisible. I've confirmed
    this several times.

    this worked:
    sPic3 = "family/purchase/images/portrait_navs/" & sTitle &
    "3.gif"
    iBut.Attributes.Add("onMouseOver", "this.src='" & sPic3 & "'")

    This gave me a script error: (tried with and without the return false):
    script = "document.GetElementByID('panel1').className =
    'vs1';return false;"
    iBut.Attributes.Add("onMouseOver", script)

    This also gave me a script error:
    script = "document.getElementById('" & Panel1.ClientID &
    "').className = 'vs1'; "
    iBut.Attributes.Add("onMouseOver", script)

    As an aside, setting the panel visible/invisible is a fall back. What I
    would REALLY want to do is set the text of a label to any one of 15
    different values, depending on what button the mouse is rolling over. Also
    I would want to set the image for an image control at the same time. But if
    I can't do that, then I thought I would pre-set up 15 different panels with
    the values already filled in, and just make one visible at the rollover.

    ---Selden
     
    Selden McCabe, Apr 25, 2005
    #5
  6. I also found another project where something like this is working, so I
    copied that script but it wasn't working for me.

    Here's what I found, in the aspx page of the other project

    onclick='document.forms[0].btnTest.click();'

    It looks like this was clicking a button, on the click event of another
    control.

    So I tried this: (image button ibPkgB is an image button, that, when you
    click it, does what I want to happen on a mouse over...)

    iBut.Attributes.Add("onMouseOver", "document.forms[0].ibPkgB.click();")

    Gave me an error, so I tried:
    iBut.Attributes.Add("onMouseOver", "document.ibPkgB.click();")

    I checked, and ibPkgB's "ID" and "ClientID" properties are both "ibPkgB" so
    it didn't seem worthwhile adding that to the script.

    So that's all I've tried so far...

    ---Selden
     
    Selden McCabe, Apr 25, 2005
    #6
    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.