I've built a trivia game using PHP and javascript. Since each question has a time limit, I've not provided a submit button; instead, the user can directly submit the answer by pressing the Enter key. After the enter key is pressed, the user is redirected to another URL which checks if the posted answer is correct, adds 10 points if the answer is correct and then updates the database with the user's points and then redirects the user to the trivia page where they have another question to answer. However, when a user enters the right answer and presses the enter key multiple times without letting the page reload, their answer is deemed as valid by the script and their points are added as any times as the answer was submitted. So, if I hit the enter key 40 times after typing in the right answer, it adds 400 points. I've tried preventing this by using:

$("form").submit(function() {
    $(this).submit(function() {
        return false;
    });
    return true;
});

But that doesn't seem to work. How do I disabled the submit action after the data is submitted once until the page is reloaded?

Any solutions using Javascript, Jquery or PHP are wele.

I've built a trivia game using PHP and javascript. Since each question has a time limit, I've not provided a submit button; instead, the user can directly submit the answer by pressing the Enter key. After the enter key is pressed, the user is redirected to another URL which checks if the posted answer is correct, adds 10 points if the answer is correct and then updates the database with the user's points and then redirects the user to the trivia page where they have another question to answer. However, when a user enters the right answer and presses the enter key multiple times without letting the page reload, their answer is deemed as valid by the script and their points are added as any times as the answer was submitted. So, if I hit the enter key 40 times after typing in the right answer, it adds 400 points. I've tried preventing this by using:

$("form").submit(function() {
    $(this).submit(function() {
        return false;
    });
    return true;
});

But that doesn't seem to work. How do I disabled the submit action after the data is submitted once until the page is reloaded?

Any solutions using Javascript, Jquery or PHP are wele.

• php
• javascript
• jquery
• html
• forms

• Might seem a bit of a silly way of doing it, but have you tried possibly after they hit enter you can use JQuery to hide the form until it reloads? – Daniel Morgan Commented May 17, 2013 at 13:20
• Can I do that using something like: $('form').submit(function() { $('answerboxid').hide(); }); – Jack Copeland Commented May 17, 2013 at 13:20
• I believe so mate, give it a try and let me know how you get on with it :) – Daniel Morgan Commented May 17, 2013 at 13:24

4 Answers 4

var isSubmitted = false;
$("form").submit(function() {
   if(!isSubmitted){
     isSubmitted = true;
   }else{
     return false;
   }
});

One of the solution you have to add to store the submit the information in the database , like for each user bofore adding the value +10 you should check if you have already added the value. The reason i suggest , because any other client side option may fail in one or other case.

Try this Code

$('#form1').submit(function(e) {
    $('#send').attr("disabled", "disabled"); // Where #send is the id of ur submit button//
});

include Jquery BlockUI plugin. http://www.malsup./jquery/block/ and include the following code in your page.

$("input").keypress(function(event) {
  if (event.which == 13) {
    event.preventDefault();
    $("form").submit();
    $.blockUI;
  }
});

When the user hits enter when a plugin will block the UI and user will not be able to hit enter again untill the page reloads.