Commit ec725fc3 authored by Jonas Götze's avatar Jonas Götze
Browse files

[WIP][FEATURE] move fields for adding a new location to a modal

todo: improve UI/Validation
future todo: hide the fields, provide new Locations via Maps API in the suggest and fill the fields via JS with the data provided by the API
parent becadef5
Pipeline #13737 passed with stages
in 4 minutes and 35 seconds
......@@ -273,7 +273,7 @@ renderables:
identifier: fieldset-event-new-location
label: 'OR add new location'
properties:
elementClassAttribute: 'ml-4 pl-4 border-left'
elementClassAttribute: 'js__eventsubmissionform__new-location-field-container'
renderables:
-
defaultValue: ''
......
......@@ -95,3 +95,40 @@ document.querySelectorAll('input.js__eventsubmissionform__location-search_input'
}));
}
});
let eventNewLocationModalIds = [];
document.querySelectorAll('fieldset.js__eventsubmissionform__new-location-field-container').forEach(function(container) {
const modalId = 'js__eventsubmissionform__new-location-modal-' + (eventNewLocationModalIds.length + 1);
eventNewLocationModalIds.push(modalId);
let childNodes = [];
const modal = document.createElement('div');
const modalButton = document.createElement('div');
modalButton.setAttribute('data-toggle','modal');
modalButton.setAttribute('data-target', '#' + modalId);
modalButton.classList.add('btn','btn-success');
modal.classList.add('modal');
modal.id = modalId;
modal.innerHTML = '<div class="modal-dialog modal-lg">\n' +
' <div class="modal-content">\n' +
' <div class="modal-header">\n' +
' <h5 class="modal-title"></h5>\n' +
' <button type="button" class="close" data-dismiss="modal" aria-label="Close">\n' +
' <span aria-hidden="true">&times;</span>\n' +
' </button>\n' +
' </div>\n' +
' <div class="modal-body">\n' +
' </div>\n' +
' </div>\n' +
' </div>';
for (let i = 0; i < container.children.length; i++) {
if (container.children[i].nodeName === 'LEGEND') {
modal.querySelector('.modal-title').textContent = container.children[i].textContent;
modalButton.textContent = container.children[i].textContent;
container.children[i].classList.add('d-none');
} else {
childNodes.push(container.children[i]);
}
}
modal.querySelector('.modal-body').append(...childNodes);
container.appendChild(modal);
container.appendChild(modalButton);
});
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment