SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2007
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question How do I do this?

    I know very little about JavaScript, so I would like someone to point me in the right direction so I can go research what I need to do and figure it out. Right now I am just walking around in the dark.

    On this site: http://kittenwar.com you click on a picture to vote for it. I understand how to do that, what I want to figure out is how the picture that doesn't get clicked gets a losing vote.

    So, no matter which picture gets clicked, they both get votes...one winner and one looser.

    I am Rails guy, so I understand how to setup the database and everything else, I just don't know where to start with the JavaScript. Thanks.

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    how the picture that doesn't get clicked gets a losing vote
    This example uses inline javascript to keep it short and sweet.

    Code:
    <form>
    <input type="hidden" name="kitten1" value="loser">
    <input type="hidden" name="kitten2" value="loser">
    <input type="image" src="kitten1.jpg" onclick="this.form.kitten1.value='winner'">
    <input type="image" src="kitten2.jpg" onclick="this.form.kitten2.value='winner'">
    </form>
    one tighter and one looser
    fixed

  3. #3
    Obey the Purebreed trib4lmaniac's Avatar
    Join Date
    Dec 2004
    Location
    Cornwall, UK
    Posts
    594
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jimfraser View Post
    This example uses inline javascript to keep it short and sweet.

    Code:
    <form>
    <input type="hidden" name="kitten1" value="loser">
    <input type="hidden" name="kitten2" value="loser">
    <input type="image" src="kitten1.jpg" onclick="this.form.kitten1.value='winner'">
    <input type="image" src="kitten2.jpg" onclick="this.form.kitten2.value='winner'">
    </form>

    fixed
    If a client has JavaScript disabled both kittens will be losers. Assuming the form gets submitted anyway that is.

  4. #4
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wouldn't it be easier to just set the name of the winner in a hidden field? Then you know that all the other ones are losers and you can withdraw a point from them.

  5. #5
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh, its only two kittens I see now.

    No hidden field is necessary, just use 2 inputs of type image and give each input a name that will be submitted.

    This solution would also make all the scared people surfing with JavaScript off happy.

  6. #6
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, if the kittens were chosen at random from a database (likely) then the server page wouldn't necessarily know which two they were, so you'd need 2 inputs submitted.

  7. #7
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, then simply set the ID of that kitten as a value on the input type image.


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
  •