fix async forms in modals

This commit is contained in:
Felix Hamann 2019-04-09 22:14:35 +02:00
parent 09a5ab94dd
commit 1824b12ae2

View File

@ -21,7 +21,10 @@
var ASYNC_FORM_RESPONSE_CLASS = 'async-form__response';
var ASYNC_FORM_LOADING_CLASS = 'async-form--loading';
var ASYNC_FORM_MIN_DELAY = 600;
var ASYNC_FORM_DEFAULT_FAILURE_MESSAGE = 'The response we received from the server did not match what we expected. Please let us know this happened via the help widget in the top navigation.';
var MODAL_SELECTOR = '.modal';
var MODAL_HEADER_KEY = 'Is-Modal';
var MODAL_HEADER_VALUE = 'True';
var asyncFormUtil = function(element) {
@ -72,6 +75,10 @@
function submitHandler(event) {
event.preventDefault();
if (!HttpClient) {
throw new Error('HttpClient not found! Can\'t fetch submit form asynchronously!');
}
element.classList.add(ASYNC_FORM_LOADING_CLASS)
lastRequestTimestamp = Date.now();
@ -79,13 +86,12 @@
var headers = { };
var body = new FormData(element);
if (options && options.headers) {
Object.keys(options.headers).forEach(function(headerKey) {
headers[headerKey] = options.headers[headerKey];
});
var isModal = element.closest(MODAL_SELECTOR);
if (!!isModal) {
headers[MODAL_HEADER_KEY] = MODAL_HEADER_VALUE;
}
window.utils.httpClient.post(url, headers, body)
HttpClient.post(url, headers, body)
.then(function(response) {
if (response.headers.get("content-type").indexOf("application/json") !== -1) {// checking response header
return response.json();
@ -95,10 +101,7 @@
}).then(function(response) {
processResponse(response[0]);
}).catch(function(error) {
var failureMessage = ASYNC_FORM_DEFAULT_FAILURE_MESSAGE;
if (options.i18n && options.i18n.asyncFormFailure) {
failureMessage = options.i18n.asyncFormFailure;
}
var failureMessage = I18n.get('asyncFormFailure');
processResponse({ content: failureMessage });
element.classList.remove(ASYNC_FORM_LOADING_CLASS);