SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Member spiritualghost's Avatar
    Join Date
    Mar 2007
    Location
    dealstop.co.uk
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Arrow Javascript problem with submit buttons placed close to each other

    Exclamation Javascript problem with submit buttons placed close to each other

    Please have a look at the page here. Below is a screenshot where the problem lies:



    As you can see, there are two buttons which have been called by a javascript here. Both have been coded to redirect to different pages. However, when I hover my mouse on the Regret button it automatically highlights both buttons and when I click regret it redirects to the page where the Confirm button is supposed to redirect. The Confirm button itself is working fine and taking me to the desired page.

    Can't figure out where the problem is with the Regret button. Any help will be much appreciated. Basically each button should redirect only to where it is supposed to as I've specified in the Javascript code.

    Disclaimer: I am absolutely noob with Javascript

  2. #2
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    lets see some code! what do you mean "hover"-what does hover have to do with anything? surely you're not using onhover for user input of a button...

    it shouldn't be more complicated than
    <input type=button onclick(window.location.href = **new location**) /> for each button set to different "new locations"

  3. #3
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    This isn't a javascript issue but a HTML issue, in your source you have a label that wraps both the text and input buttons. If this remove this label it will work normally.

  4. #4
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry, it's not my problem Sgt but what do you mean label? are you talking about "name=" or a div ID?

    Why would either of those attributes changed the functionality of onclick()?

  5. #5
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by anarch View Post
    sorry, it's not my problem Sgt but what do you mean label? are you talking about "name=" or a div ID?

    Why would either of those attributes changed the functionality of onclick()?
    This is his page source in Firebug
    HTML Code:
    <label class="formFieldQuestion"><h3>I would like to <input type="button" onclick="document.location = 'http://audiquattrofinal.tigersportsmarketing.com/attending/index.html';" value="Confirm"> / <input type="button" onclick="document.location = 'thankyou.html';" value="Regret"> my participation in the Audi quattro Cup 2011 - India Finals</h3></label>
    His HTML is wrapped by a label element which by default gets event handlers set by the browser and anything inside it gets rendered useless unless you absolutely position it on the page.

  6. #6
    SitePoint Member spiritualghost's Avatar
    Join Date
    Mar 2007
    Location
    dealstop.co.uk
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SgtLegend View Post
    This isn't a javascript issue but a HTML issue, in your source you have a label that wraps both the text and input buttons. If this remove this label it will work normally.
    Thanks a ton I removed the label class and its working fine now! I was going mad trying to figure out what went wrong

    Quote Originally Posted by anarch View Post
    lets see some code! what do you mean "hover"-what does hover have to do with anything? surely you're not using onhover for user input of a button...
    Actually yes the hover has nothing to do with it. But I noticed that when you hover the mouse on a button there is a light blue highlight on it. Now when I was hovering the mouse on the "Regret" button it was highlighting both the buttons instead of one. Now its been resolved and only the relevant button is being highlighted on hover. Phew

  7. #7
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    No problem, the most simple issues will and can give you a bigger headache then then want.

  8. #8
    SitePoint Member spiritualghost's Avatar
    Join Date
    Mar 2007
    Location
    dealstop.co.uk
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    True.

    PS: I am loving Sitepoint I'll be more regular here! Seeing great guys who really know their stuff!!

  9. #9
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    oooh that label... bahaha i didn't even know there was label tag in html.

    I didn't know there was source included but I suppose searching for his words in the screenshot would of made it easy to find :-P

    spiritualghost - get firebug!! after developing in pre-dynamic html, firebug-like plugins or programs are a god send!

  10. #10
    SitePoint Member spiritualghost's Avatar
    Join Date
    Mar 2007
    Location
    dealstop.co.uk
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by anarch View Post
    oooh that label... bahaha i didn't even know there was label tag in html.

    I didn't know there was source included but I suppose searching for his words in the screenshot would of made it easy to find :-P

    spiritualghost - get firebug!! after developing in pre-dynamic html, firebug-like plugins or programs are a god send!
    Thanks for the tip. I'll get it.

  11. #11
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by anarch View Post
    oooh that label... bahaha i didn't even know there was label tag in html.
    I'm a front end web developer by trade so i have to know these things

    Quote Originally Posted by anarch View Post
    I didn't know there was source included but I suppose searching for his words in the screenshot would of made it easy to find :-P
    There wasn't, he included a link within his post which allowed me to see the source.

    Quote Originally Posted by anarch View Post
    spiritualghost - get firebug!! after developing in pre-dynamic html, firebug-like plugins or programs are a god send!
    I second this, Firebug is the most powerful web development tool for Firefox and i haven't looked back on any other since.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •