Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    Regular Coder
    Join Date
    Sep 2011
    Posts
    348
    Thanks
    39
    Thanked 0 Times in 0 Posts

    Preventing a user to click a second time

    Hello, I'm making a basic rating system in CSS and JavaScript.. I want that when a user has clicked on the button, he cannot click again on it after that, how to prevent this? If possible with JQuery is welcome..

  • #2
    Regular Coder
    Join Date
    Dec 2010
    Location
    Sheffield, UK
    Posts
    138
    Thanks
    81
    Thanked 1 Time in 1 Post
    My knowledge of JavaScript is fairly basic, so if anyone has got a better way to do this, which no doubt there will be, feel free to post it.

    I see this as a fairly simple script, and here's what I've got:

    JavaScript code:

    Code:
    function disableButton() {
    document.getElementById("button1").disabled = true;
    }
    HTML code:

    Code:
    <body> 
    <input type="submit" id="button1" onClick="disableButton()"/> 
    </body>
    </html>
    Just a single JavaScript statement which changes the button element's disabled value to true, therefore disabling it. See if that works how you want it to. As already mentioned, my knowledge of JavaScript is very little, and someone else will probably be able to do this much better than me.
    Last edited by Hashim1; 05-23-2012 at 08:10 PM.
    http://www.topcashback.co.uk/ref/hashim1

    ^
    Total earnings so far: £25.15
    A very generous cashback site worth checking out.


  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,017
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    Quote Originally Posted by angelali View Post
    Hello, I'm making a basic rating system in CSS and JavaScript.. I want that when a user has clicked on the button, he cannot click again on it after that, how to prevent this? If possible with JQuery is welcome..
    You do not need the sledgehammer of jQuery to crack this small nut!

    Code:
    <input type = "button" id = "mybutton" value= "You May Click this Button Once Only" onclick = "this.disabled = true">
    Remember that the user can simply press F5 and reload the page! To stop that you would have to use a cookie to record that the button had been pressed - which the user can also delete. I would think this one through!

    Hashim1 - a submit button does what it says - it submits a form to a server-side script. Once the form has been submitted the page will reload.

    He has won six million dollars in as many years. - Presenter, Channel 5
    Last edited by Philip M; 05-23-2012 at 08:08 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #4
    Regular Coder
    Join Date
    Sep 2011
    Posts
    348
    Thanks
    39
    Thanked 0 Times in 0 Posts
    That's i want, the cookie things.... I did not know how to explain this above in my question

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,640
    Thanks
    0
    Thanked 649 Times in 639 Posts
    They could also turn off JavaScript and then click lots of times - or simply use their browser privacy mode that disables JavaScript's ability to write cookies.

    To prevent their subsequent clicks being counted you'd need to do something server side - perhaps by collecting the ip address and discarding additional clicks made from that ip address in the next so many minutes after the first one. You wouldn't want to block it entirely as the ip may be being shared by hundreds of people in an office or swapped around by the ISP so that different people are using it at different times.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,017
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    Quote Originally Posted by angelali View Post
    That's i want, the cookie things.... I did not know how to explain this above in my question
    But the user can easily delete the cookie! Or disable Javascript!

    The "cookie things" have been covered a zillion times in this forum - try using the search feature. But you may find cookies are too advanced for you at this stage.

    felgall's suggestion would probably work, but IP adresses are often dynamic and change every time the user re-boots his router. You could block a second click in this way for some minutes, or even an hour or so, but not permanently.

    As I say, I would think this one through.
    Last edited by Philip M; 05-23-2012 at 08:19 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #7
    Regular Coder
    Join Date
    Sep 2011
    Posts
    348
    Thanks
    39
    Thanked 0 Times in 0 Posts
    If like that, I better do this in PHP and store the rating in database..

  • #8
    Regular Coder
    Join Date
    Dec 2010
    Location
    Sheffield, UK
    Posts
    138
    Thanks
    81
    Thanked 1 Time in 1 Post
    Quote Originally Posted by Philip M View Post
    You do not need the sledgehammer of jQuery to crack this small nut!

    Code:
    <input type = "button" id = "mybutton" value= "You May Click this Button Once Only" onclick = "this.disabled = true">
    Remember that the user can simply press F5 and reload the page! To stop that you would have to use a cookie to record that the button had been pressed - which the user can also delete. I would think this one through!

    Hashim1 - a submit button does what it says - it submits a form to a server-side script. Once the form has been submitted the page will reload.

    He has won six million dollars in as many years. - Presenter, Channel 5
    Ah, ok, I see what you mean. So my script would have worked if the button was an ordinary button which didn't reload the page?
    http://www.topcashback.co.uk/ref/hashim1

    ^
    Total earnings so far: £25.15
    A very generous cashback site worth checking out.


  • #9
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,640
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by Hashim1 View Post
    So my script would have worked if the button was an ordinary button which didn't reload the page?
    Then it would do nothing at all if JavaScript isn't enabled for the page.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #10
    Regular Coder Taro's Avatar
    Join Date
    Oct 2011
    Location
    Geraldton, Ontario
    Posts
    155
    Thanks
    1
    Thanked 1 Time in 1 Post
    Hello,

    You can try to learn from this webpage. It uses server-side (PHP), client-side (JavaScript/ J SON/ J Query), and database-side (MySQL) scripting. It should be possible to incorporate the piece of code with the system.
    Element ID

    Webs Support Helper

    Your friendly neighborhood Taroman.

  • #11
    Regular Coder
    Join Date
    Dec 2010
    Location
    Sheffield, UK
    Posts
    138
    Thanks
    81
    Thanked 1 Time in 1 Post
    Quote Originally Posted by felgall View Post
    Then it would do nothing at all if JavaScript isn't enabled for the page.
    Of course it wouldn't - to run a JavaScript code it's a given that you need to have it actually enabled. I'm asking whether the code I posted would be working client-side code, provided JavaScript is enabled?
    http://www.topcashback.co.uk/ref/hashim1

    ^
    Total earnings so far: £25.15
    A very generous cashback site worth checking out.


  • #12
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,640
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by Hashim1 View Post
    Of course it wouldn't - to run a JavaScript code it's a given that you need to have it actually enabled. I'm asking whether the code I posted would be working client-side code, provided JavaScript is enabled?
    Well in that case you should be adding the button itself from the JavaScript so that those without JavaScript don't see a broken button.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #13
    Regular Coder
    Join Date
    Sep 2011
    Posts
    348
    Thanks
    39
    Thanked 0 Times in 0 Posts
    I'm doing it in PHP and MySQL...


  •  

    Posting Permissions

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