Merge branch 'doits-master'

Author: JangoSteve

src/rails.js

@@ -49,7 +49,7 @@
 
   $.rails = rails = {
     // Link elements bound by jquery-ujs
-    linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]',
+    linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]',
 
 		// Select elements bound by jquery-ujs
 		inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]',
@@ -72,6 +72,9 @@
     // Form file input elements
     fileInputSelector: 'input:file',
 
+    // Link onClick disable selector with possible reenable after remote submission
+    linkDisableSelector: 'a[data-disable-with]',
+
     // Make sure that every Ajax request sends the CSRF token
     CSRFProtection: function(xhr) {
       var token = $('meta[name="csrf-token"]').attr('content');
@@ -253,15 +256,43 @@
         });
       }
       return continuePropagation;
+    },
+
+    //  replace element's html with the 'data-disable-with' after storing original html
+    //  and prevent clicking on it
+    disableElement: function(element) {
+      element.data('ujs:enable-with', element.html()); // store enabled state
+      element.html(element.data('disable-with')); // set to disabled state
+      element.bind('click.railsDisable', function(e) { // prevent further clicking
+        return rails.stopEverything(e)
+      });
+    },
+
+    // restore element to its original state which was disabled by 'disableElement' above
+    enableElement: function(element) {
+      if (element.data('ujs:enable-with') !== undefined) {
+        element.html(element.data('ujs:enable-with')); // set to old enabled state
+        // this should be element.removeData('ujs:enable-with')
+        // but, there is currently a bug in jquery which makes hyphenated data attributes not get removed
+        element.data('ujs:enable-with', false); // clean up cache
+      }
+      element.unbind('click.railsDisable'); // enable element
     }
+
   };
 
   $.ajaxPrefilter(function(options, originalOptions, xhr){ if ( !options.crossDomain ) { rails.CSRFProtection(xhr); }});
 
+  $(rails.linkDisableSelector).live('ajax:complete', function() {
+      rails.enableElement($(this));
+  });
+
   $(rails.linkClickSelector).live('click.rails', function(e) {
     var link = $(this);
     if (!rails.allowAction(link)) return rails.stopEverything(e);
 
+    if (link.is(rails.linkDisableSelector)) rails.disableElement(link);
+
     if (link.data('remote') !== undefined) {
       rails.handleRemote(link);
       return false;

test/public/test/data-disable.js

@@ -15,6 +15,12 @@ module('data-disable', {
       .find('form:last')
       // WEEIRDD: the form won't submit to an iframe if the button is name="submit" (??!)
       .append($('<input type="submit" data-disable-with="submitting ..." name="submit2" value="Submit" />'));
+
+    $('#qunit-fixture').append($('<a />', {
+      text: 'Click me',
+      href: '/echo',
+      'data-disable-with': 'clicking...'
+    }));
   }
 });
 
@@ -133,3 +139,44 @@ asyncTest('form textarea with "data-disable-with" attribute', 3, function() {
   ok(textarea.is(':disabled'), 'textarea should be disabled');
   equal(textarea.val(), 'processing ...', 'textarea should have disabled value given to it');
 });
+
+asyncTest('link with "data-disable-with" attribute disables', 4, function() {
+  var link = $('a[data-disable-with]');
+
+  ok(!link.data('ujs:enable-with'), 'link should not be disabled');
+  equal(link.html(), 'Click me', 'link should have value given to it');
+
+  function checkDisabledLink() {
+    ok(link.data('ujs:enable-with'), 'link should be disabled');
+    equal(link.html(), 'clicking...');
+  }
+
+  link.trigger('click');
+  checkDisabledLink();
+  start();
+});
+
+asyncTest('remote link with "data-disable-with" attribute disables and re-enables', 6, function() {
+  var link = $('a[data-disable-with]').attr('data-remote', true);
+
+  function checkEnabledLink() {
+    ok(!link.data('ujs:enable-with'), 'link should not be disabled');
+    equal(link.html(), 'Click me', 'link should have value given to it');
+  }
+  checkEnabledLink();
+
+  function checkDisabledLink() {
+    ok(link.data('ujs:enable-with'), 'link should be disabled');
+    equal(link.html(), 'clicking...');
+  }
+
+  link
+    .bind('ajax:beforeSend', function() {
+      checkDisabledLink();
+    })
+    .live('ajax:complete', function() {
+      checkEnabledLink();
+      start();
+    })
+    .trigger('click');
+});