Preventing multiple clicks of submit button

In the past, when I worked with HTML directly, I used to attach to my submit buttons 'onclick' events which disabled them.

Here's a tiny module I wrote to do exactly that. It disables the submit button after you click it. I wrote it just for fun. It isn't very sexy.

Installation

1. Save this code in a file named 'submit_once.module'
2. Copy it to your modules folder
3. Enable it (administer » modules)

define('DEFAULT_WAIT_MSG', ' (Wait...)');

function submit_once_help($section = '')
{
  switch ($section) {
    case 'admin/modules#description':
      return t('Disable submit buttons after one click.');
  }
}

function submit_once_form_alter($form_id, &$form)
{
  foreach (element_children($form) as $name) {
    if ($form[$name]['#type'] == 'submit') {
      if (!isset($form[$name]['#attributes']))
        $form[$name]['#attributes'] = array();
      $form[$name]['#attributes']['onclick'] =
        "this_btn=this;this.value+='".DEFAULT_WAIT_MSG."';setTimeout('this_btn.disabled=true',0)";
    }
  }
}

I know editing modules is a no no, but this is what you could do to add this functionality to an existing form in a module:

Add this line:

'#attributes' => array("onclick" => "javascript: this.value='Please Wait...'; this.disabled = true;"),

to this array

$form['submitbutton'] = array(
          '#type' => 'submit',
          '#value' => t('Submit'),
          '#weight' => 1000,
          	'#attributes' => array("onclick" => "javascript: this.value='Please Wait...'; this.disabled = true;"),
        );

That should change the text in the submit button and render it disabled - when clicked.

Wasted nearly a day for a specific D6 site where I wanted to use jQuery to disable the submit button by adding a click handler. Done that before on Drupal6 sites but on this site it just wouldn't work they way I wanted it to.

I was adding a click handler on the submit (not preview) button of the drupal 6 core comment_form. When clicking the submit button, the comment was not saved! DPM-ing around in the comment module, I noticed that the form did not pass validation. It did not throw an error either!

I ended up in concluding that the Drupal 6 core 'form tampering protection' kicked in for a still unknown reason. Usually you would get the obscure 'Illegal choice detected ...' error in such a case, but nothing... Vaildation simply fails. The solution I ended up in using was this:

(function($) {

  Drupal.behaviors.disableReviewButton = function() {
    $('#comment-form #edit-submit').click(function(e){
      $('#comment-form #edit-submit').hide();
      $('#edit-submit-wrapper').append(
        $('<input />').attr('type', 'button').attr('disabled', true).addClass('form-submit').val(Drupal.t('Processing...'))
      );
    });
  }

})(jQuery);

Note that I replaced the input button with another button to avoid restyling!

Helped me, might save someone a day of pulling hair :-p

Hi Guys,

I have noticed this problem before, in other places too. For example when you are creating terms in a category. If you bash enter a few times it will create as many as you like.

I suggest adding these js files across the board, ie for all forms on the site.

I have tried this out on a site thats in development now and it is working. Can you think of any reason not to do this?

function _blockui_js() {
	$path =  drupal_get_path('module', 'blockui');
	drupal_add_js("{$path}/jquery.blockUI.js");
	drupal_add_js("{$path}/blockui.js");	
}


/*function blockui_nodeapi(&$node, $op, $a3 = null, $a4 = null) {
	if($op == 'prepare') {
		_blockui_js();
	}
}

function blockui_comment(&$a1, $op) {
	if($op != 'form') {
		_blockui_js();
	}
}*/

function blockui_menu() {
	_blockui_js();
}

Cheers

Rob

Hi, can you update it to drupal 6 compatible module. blockui

http://drupal.org/project/hide_submit