CODEWITHSUNDEEP
javascriptjqueryhtml
Juliette Dupuis
Juliette Dupuis

Reputation: 1037

Limit the number of time a form can be submitted

I have a textarea:

      <form id='test'>
      <textarea class='test2'> </textarea> <input type='submit' value='send'/>
      </form>

I would like to know if there is a way to limit the number of times a user can submit the textarea (for example, 5 times per minute).

EDIT: I would like to do that on client-side, in Javascript.

EDIT 2:

It is for a chat. I just don't want people to be able to post too many messages within a small lap of time. So it's not a problem if they refresh their page to get ride of the limit, the time they'll take to do it is long enough...

Upvotes: 1

Views: 4443

Answers (4)

Jav Rok
Jav Rok

Reputation: 331

Like they said, it's not professional, nor secure to do this with javascript. Better server-side, but here you go:

<script type="text/javascript"> 
var flag = false;
function checkTimer(){
    if (flag){
        flag=false;
        return true;
    }
    alert("Don't flood man!");
    return false;
}

//12 seconds, max 5 times per minute
setTimeout(function(){flag=true;},12000);
</script>

And on the form:

<form id='test' onSubmit="return checkTimer()">

Upvotes: 1

Robert E. McIntosh
Robert E. McIntosh

Reputation: 6135

I made this quick little sample on jsFiddle. You are probably going to need to warp this in some ajax so you can submit the form without reloading the variables to retain your information.

If you are looking for the AJAX version it would look something 

// Setup variable for easy tracking!!!
var timesSubmitted = 0, timeCounter = 60 * 1000, Timer = null;

// Call function to submit form
function submitForm() {
  // Check if user has submitted form more than 5 times
  if (timesSubmitted < 5) {
      // Call ajax to submit form. jQuery Ajax: http://api.jquery.com/jQuery.ajax/
      $.ajax({
          type: "POST",
          url: 'ajaxpage.html',
          data: { test2: $('#test textarea').val() },
          success: function(data) { // if form is submitted successfully
              // If timer has yet to be started... Start it! 
              if (Timer === null) {
                  Timer = setTimeout(
                      function() {  
                          // Setup alert so user knows they can continue to submit form
                          if (timesSubmitted > 0) { alert('Submissions Reset'); }
                          timesSubmitted = 0; 
                      }, 
                  timeCounter );
              }

              // Add for submission to counter
              timesSubmitted++;
            }
      });
  }else{
      // Alert user they can not sumbit anymore!
      alert('You may only submit this from 5 times per minute!');
  }
}

Upvotes: 1

Joe
Joe

Reputation: 82604

You can store some variables:

$(function () {
   var timesSubmitted = 0;
   var maxSubmits = 5;
   var intervalMilliseconds = 10000; // for testing   
   var interval;   
    $('input[type=submit]').click(function (event) {
        if (!interval) {
            interval = setTimeout(function () {
                interval = undefined;
                timesSubmitted = 0;
                $('div').append('TIMER RESET. Submit again.<br />')
            }, intervalMilliseconds);
        }
        timesSubmitted ++;
        if (timesSubmitted > maxSubmits) {
            $('div').append('NO GO YO!<br />')
        } else {
            $('div').append('valid<br />')   
        }
        event.preventDefault();        
    });        
});​

Example

Upvotes: 2

Marcin Orlowski
Marcin Orlowski

Reputation: 75629

No, there's no way to limit this on client side (you could try to use JavaScript to enforce such limit but it can be easily ommited by disabling JS). You can enforce such limit on your target script and refuse form processing if it comes to often

Upvotes: 0

Related Questions