diff --git a/src/rails.js b/src/rails.js
index d6e585fa..c3550bbd 100644
--- a/src/rails.js
+++ b/src/rails.js
@@ -51,8 +51,8 @@
// Link elements bound by jquery-ujs
linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]',
- // Select elements bound by jquery-ujs
- selectChangeSelector: 'select[data-remote]',
+ // Select elements bound by jquery-ujs
+ selectChangeSelector: 'select[data-remote]',
// Form elements bound by jquery-ujs
formSubmitSelector: 'form',
@@ -85,9 +85,22 @@
return event.result !== false;
},
+ resolveOrReject: function(deferred, resolved) {
+ if (resolved) {
+ deferred.resolve();
+ } else {
+ deferred.reject();
+ }
+ return deferred;
+ },
+
// Default confirm dialog, may be overridden with custom confirm dialog in $.rails.confirm
confirm: function(message) {
- return confirm(message);
+ var res = confirm(message),
+ answer = $.Deferred();
+
+ rails.resolveOrReject(answer, res);
+ return answer.promise();
},
// Default ajax function, may be overridden with custom function in $.rails.ajax
@@ -97,10 +110,10 @@
// Submits "remote" forms and links with ajax
handleRemote: function(element) {
- var method, url, data,
- crossDomain = element.data('cross-domain') || null,
- dataType = element.data('type') || ($.ajaxSettings && $.ajaxSettings.dataType),
- options;
+ var method, url, data, button,
+ crossDomain = element.data('cross-domain') || null,
+ dataType = element.data('type') || ($.ajaxSettings && $.ajaxSettings.dataType),
+ options;
if (rails.fire(element, 'ajax:before')) {
@@ -109,7 +122,7 @@
url = element.attr('action');
data = element.serializeArray();
// memoized value from clicked submit button
- var button = element.data('ujs:submit-button');
+ button = element.data('ujs:submit-button');
if (button) {
data.push(button);
element.data('ujs:submit-button', null);
@@ -120,9 +133,9 @@
data = element.serialize();
if (element.data('params')) data = data + "&" + element.data('params');
} else {
- method = element.data('method');
- url = element.attr('href');
- data = element.data('params') || null;
+ method = element.data('method');
+ url = element.attr('href');
+ data = element.data('params') || null;
}
options = {
@@ -155,14 +168,19 @@
// Delete
handleMethod: function(link) {
var href = link.attr('href'),
- method = link.data('method'),
- csrf_token = $('meta[name=csrf-token]').attr('content'),
- csrf_param = $('meta[name=csrf-param]').attr('content'),
- form = $(''),
- metadata_input = '';
-
- if (csrf_param !== undefined && csrf_token !== undefined) {
- metadata_input += '';
+ method = link.data('method') || 'GET',
+ csrf_token = $('meta[name=csrf-token]').attr('content'),
+ csrf_param = $('meta[name=csrf-param]').attr('content'),
+ form = $('', { action: href, method: method, 'data-ujs-generated': 'true' }),
+ metadata_input = '';
+
+ if (method !== 'GET') {
+ form.attr('method', 'POST');
+ metadata_input += '';
+
+ if (csrf_param !== undefined && csrf_token !== undefined) {
+ metadata_input += '';
+ }
}
form.hide().append(metadata_input).appendTo('body');
@@ -176,7 +194,9 @@
*/
disableFormElements: function(form) {
form.find(rails.disableSelector).each(function() {
- var element = $(this), method = element.is('button') ? 'html' : 'val';
+ var element = $(this),
+ method = element.is('button') ? 'html' : 'val';
+
element.data('ujs:enable-with', element[method]());
element[method](element.data('disable-with'));
element.attr('disabled', 'disabled');
@@ -189,7 +209,9 @@
*/
enableFormElements: function(form) {
form.find(rails.enableSelector).each(function() {
- var element = $(this), method = element.is('button') ? 'html' : 'val';
+ var element = $(this),
+ method = element.is('button') ? 'html' : 'val';
+
if (element.data('ujs:enable-with')) element[method](element.data('ujs:enable-with'));
element.removeAttr('disabled');
});
@@ -207,20 +229,36 @@
*/
allowAction: function(element) {
var message = element.data('confirm'),
- answer = false, callback;
- if (!message) { return true; }
+ confirmAnswer,
+ answer = $.Deferred();
+
+ if (!message) { return $.when(true); }
if (rails.fire(element, 'confirm')) {
- answer = rails.confirm(message);
- callback = rails.fire(element, 'confirm:complete', [answer]);
+ confirmAnswer = rails.confirm(message);
+ confirmAnswer.then(
+ function() {
+ var callbackOk = rails.fire(element, 'confirm:complete', [ true ]);
+ rails.resolveOrReject(answer, callbackOk);
+ },
+ function() {
+ rails.fire(element, 'confirm:complete', [ false ]);
+ answer.reject();
+ }
+ );
+ return answer.promise();
+ // If `confirm` event handler returned false...
+ } else {
+ answer.reject();
+ return answer.promise();
}
- return answer && callback;
},
// Helper function which checks for blank inputs in a form that match the specified CSS selector
blankInputs: function(form, specifiedSelector, nonBlank) {
var inputs = $(), input,
- selector = specifiedSelector || 'input,textarea';
+ selector = specifiedSelector || 'input,textarea';
+
form.find(selector).each(function() {
input = $(this);
// Collect non-blank inputs if nonBlank option is true, otherwise, collect blank inputs
@@ -247,6 +285,7 @@
// manually invoke them. If anyone returns false then stop the loop
callFormSubmitBindings: function(form) {
var events = form.data('events'), continuePropagation = true;
+
if (events !== undefined && events['submit'] !== undefined) {
$.each(events['submit'], function(i, obj){
if (typeof obj.handler === 'function') return continuePropagation = obj.handler(obj.data);
@@ -260,65 +299,99 @@
$(rails.linkClickSelector).live('click.rails', function(e) {
var link = $(this);
- if (!rails.allowAction(link)) return rails.stopEverything(e);
- if (link.data('remote') !== undefined) {
- rails.handleRemote(link);
- return false;
- } else if (link.data('method')) {
- rails.handleMethod(link);
- return false;
- }
+ rails.allowAction(link).then(
+ function() {
+ if (link.data('remote') !== undefined) {
+ rails.handleRemote(link);
+ } else {
+ rails.handleMethod(link);
+ }
+ },
+ function() {
+ rails.stopEverything(e);
+ }
+ );
+
+ e.preventDefault();
});
- $(rails.selectChangeSelector).live('change.rails', function(e) {
+ $(rails.selectChangeSelector).live('change.rails', function(e) {
var link = $(this);
- if (!rails.allowAction(link)) return rails.stopEverything(e);
- rails.handleRemote(link);
- return false;
- });
+ rails.allowAction(link).then(
+ function() {
+ rails.handleRemote(link);
+ },
+ function() {
+ rails.stopEverything(e);
+ }
+ );
+
+ e.preventDefault();
+ });
$(rails.formSubmitSelector).live('submit.rails', function(e) {
var form = $(this),
- remote = form.data('remote') !== undefined,
- blankRequiredInputs = rails.blankInputs(form, rails.requiredInputSelector),
- nonBlankFileInputs = rails.nonBlankInputs(form, rails.fileInputSelector);
+ remote = (form.data('remote') !== undefined),
+ blankRequiredInputs = rails.blankInputs(form, rails.requiredInputSelector),
+ nonBlankFileInputs = rails.nonBlankInputs(form, rails.fileInputSelector);
+
+ rails.allowAction(form).then(
+ function() {
+ // skip other logic when required values are missing or file upload is present
+ if (blankRequiredInputs && form.attr("novalidate") == undefined && rails.fire(form, 'ajax:aborted:required', [blankRequiredInputs])) {
+ return rails.stopEverything(e);
+ }
- if (!rails.allowAction(form)) return rails.stopEverything(e);
+ if (remote) {
+ if (nonBlankFileInputs) {
+ return rails.fire(form, 'ajax:aborted:file', [nonBlankFileInputs]);
+ }
- // skip other logic when required values are missing or file upload is present
- if (blankRequiredInputs && form.attr("novalidate") == undefined && rails.fire(form, 'ajax:aborted:required', [blankRequiredInputs])) {
- return rails.stopEverything(e);
- }
+ // If browser does not support submit bubbling, then this live-binding will be called before direct
+ // bindings. Therefore, we should directly call any direct bindings before remotely submitting form.
+ if (!$.support.submitBubbles && rails.callFormSubmitBindings(form) === false) return rails.stopEverything(e);
- if (remote) {
- if (nonBlankFileInputs) {
- return rails.fire(form, 'ajax:aborted:file', [nonBlankFileInputs]);
+ rails.handleRemote(form);
+ } else {
+ // slight timeout so that the submit button gets properly serialized
+ setTimeout(function() {
+ rails.disableFormElements(form);
+ // Submit the form from dom-level js (i.e. *not* via jquery),
+ // which will skip all submit bindings (including this live-binding),
+ // since they have already been called.
+ form.get(0).submit();
+ }, 13);
+ }
+ },
+ function() {
+ rails.stopEverything(e);
}
+ );
- // If browser does not support submit bubbling, then this live-binding will be called before direct
- // bindings. Therefore, we should directly call any direct bindings before remotely submitting form.
- if (!$.support.submitBubbles && rails.callFormSubmitBindings(form) === false) return rails.stopEverything(e);
-
- rails.handleRemote(form);
- return false;
- } else {
- // slight timeout so that the submit button gets properly serialized
- setTimeout(function(){ rails.disableFormElements(form); }, 13);
- }
+ e.preventDefault();
});
$(rails.formInputClickSelector).live('click.rails', function(event) {
var button = $(this);
- if (!rails.allowAction(button)) return rails.stopEverything(event);
-
- // register the pressed submit button
- var name = button.attr('name'),
- data = name ? {name:name, value:button.val()} : null;
+ rails.allowAction(button).then(
+ function() {
+ // register the pressed submit button
+ var name = button.attr('name'), form,
+ data = name ? {name:name, value:button.val()} : null;
+
+ form = button.closest('form');
+ form.data('ujs:submit-button', data);
+ form.submit();
+ },
+ function() {
+ rails.stopEverything(event);
+ }
+ );
- button.closest('form').data('ujs:submit-button', data);
+ event.preventDefault();
});
$(rails.formSubmitSelector).live('ajax:beforeSend.rails', function(event) {
@@ -330,3 +403,4 @@
});
})( jQuery );
+
diff --git a/test/public/test/data-confirm.js b/test/public/test/data-confirm.js
index 68784b84..2df4dae4 100644
--- a/test/public/test/data-confirm.js
+++ b/test/public/test/data-confirm.js
@@ -5,12 +5,19 @@ module('data-confirm', {
'data-remote': 'true',
'data-confirm': 'Are you absolutely sure?',
text: 'my social security number'
+ }))
+ .append($('', {
+ action: '/echo',
+ 'data-confirm': 'true',
+ method: 'post'
}));
this.windowConfirm = window.confirm;
},
teardown: function() {
window.confirm = this.windowConfirm;
+
+ $('form[data-ujs-generated]').remove();
}
});
@@ -99,3 +106,45 @@ asyncTest('binding to confirm:complete event and returning false', 2, function()
start();
}, 50);
});
+
+asyncTest('clicking non-ajax link with data-confirm', 2, function() {
+ window.confirm = function(msg) {
+ ok(true, 'confirm dialog should be called');
+ return true;
+ };
+
+ $('a[data-confirm]')
+ .removeAttr('data-remote')
+ .bind('click', function() {
+ ok(true, 'direct click binding should only be called once');
+ })
+ .bind('ajax:beforeSend', function() {
+ ok(false, 'ajax should not be called');
+ })
+ .trigger('click');
+
+ setTimeout(function() {
+ start();
+ }, 10);
+});
+
+asyncTest('submitting non-ajax form with data-confirm', 3, function() {
+ window.confirm = function(msg) {
+ ok(true, 'confirm dialog should be called');
+ return true;
+ };
+
+ $('form[data-confirm]')
+ .bind('submit', function() {
+ ok(true, 'direct submit binding should only be called once');
+ })
+ .bind('ajax:beforeSend', function() {
+ ok(false, 'ajax should not be called');
+ })
+ .bind('iframe:loaded', function() {
+ ok(true, 'should submit via non-ajax');
+ start();
+ })
+ .trigger('submit');
+
+});
diff --git a/test/public/test/data-method.js b/test/public/test/data-method.js
index 34c282e0..0dd6364f 100644
--- a/test/public/test/data-method.js
+++ b/test/public/test/data-method.js
@@ -1,6 +1,10 @@
(function(){
-module('data-method');
+module('data-method', {
+ teardown: function() {
+ $('form[data-ujs-generated]').remove();
+ }
+});
function submit(fn) {
$('#qunit-fixture').
@@ -31,4 +35,4 @@ asyncTest('link with "data-method" and CSRF', 1, function() {
});
});
-})();
\ No newline at end of file
+})();
diff --git a/test/public/test/settings.js b/test/public/test/settings.js
index c58734d7..488cf241 100644
--- a/test/public/test/settings.js
+++ b/test/public/test/settings.js
@@ -22,15 +22,42 @@ App.assert_request_path = function(request_env, path) {
// hijacks normal form submit; lets it submit to an iframe to prevent
// navigating away from the test suite
-$(document).bind('submit', function(e) {
- if (!e.isDefaultPrevented()) {
- var form = $(e.target), action = form.attr('action'),
- name = 'form-frame' + jQuery.guid++,
- iframe = $('');
-
- if (action.indexOf('iframe') < 0) form.attr('action', action + '?iframe=true')
- form.attr('target', name);
- $('#qunit-fixture').append(iframe);
- $.event.trigger('iframe:loading', form);
- }
-});
+//$(document).bind('submit', function(e) {
+// if (!e.isDefaultPrevented()) {
+// var form = $(e.target), action = form.attr('action'),
+// name = 'form-frame' + jQuery.guid++,
+// iframe = $('');
+//
+// if (action.indexOf('iframe') < 0) form.attr('action', action + '?iframe=true')
+// form.attr('target', name);
+// $('#qunit-fixture').append(iframe);
+// $.event.trigger('iframe:loading', form);
+// }
+//});
+
+// The above doesn't work, since rails.js now calls the dom-level form.submit() function
+// for normal forms after all bindings have been run. The below more directly accomplishes
+// its intentions anyway, for the purposes of making sure the test suite never navigates
+// to a new page for non-ajax submitted forms.
+// See for explanation: http://diveintogreasemonkey.org/patterns/override-method.html
+var iframeSubmit = function(event) {
+ var target = event ? event.target : this,
+ form = $(target), action = form.attr('action'),
+ name = 'form-frame' + jQuery.guid++,
+ iframe = $('');
+
+ if (action.indexOf('iframe') < 0) form.attr('action', action + '?iframe=true')
+ form.attr('target', name);
+ $('#qunit-fixture').append(iframe);
+ $.event.trigger('iframe:loading', form);
+
+ this._submit();
+}
+
+// capture the onsubmit event on all forms
+window.addEventListener('submit', iframeSubmit, true);
+
+// If a script calls someForm.submit(), the onsubmit event does not fire,
+// so we need to redefine the submit method of the HTMLFormElement class.
+HTMLFormElement.prototype._submit = HTMLFormElement.prototype.submit;
+HTMLFormElement.prototype.submit = iframeSubmit;