Added modal to raw_id_fields #37

pull/49/head
Fabio Caccamo 2018-08-31 15:21:30 +02:00
parent a96a70400f
commit 4a848948a0
1 changed files with 68 additions and 25 deletions

View File

@ -1,23 +1,45 @@
if(typeof django !== 'undefined' && typeof django.jQuery !== 'undefined' ) if (typeof(django) !== 'undefined' && typeof(django.jQuery) !== 'undefined')
{ {
(function($) { (function($) {
$(document).ready(function(){ $(document).ready(function(){
// create the function that will close the modal function dismissModal()
function dismissRelatedObjectModal()
{ {
// close the popup as modal
$.magnificPopup.close(); $.magnificPopup.close();
} }
// assign the function to a global variable // create the function that will close the modal
function dismissRelatedObjectModal()
{
dismissModal();
}
function dismissRelatedLookupModal(win, chosenId)
{
var windowRef = win;
var windowName = windowRef.name;
var widgetName = windowName.replace(/^(change|add|delete|lookup)_/, '');
var widgetEl = $('#' + widgetName);
var widgetVal = widgetEl.val();
if (widgetEl.hasClass('vManyToManyRawIdAdminField') && Boolean(widgetVal)) {
widgetEl.val(widgetVal + ', ' + chosenId);
} else {
widgetEl.val(chosenId);
}
dismissModal();
}
// assign functions to global variables
window.dismissRelatedObjectModal = dismissRelatedObjectModal; window.dismissRelatedObjectModal = dismissRelatedObjectModal;
window.dismissRelatedLookupPopup = dismissRelatedLookupModal;
function presentRelatedObjectModal(e) function presentRelatedObjectModal(e)
{ {
var href = ($(this).attr('href') || ''); var linkEl = $(this);
if( href == '' ){
var href = (linkEl.attr('href') || '');
if (href == '') {
return; return;
} }
@ -26,40 +48,57 @@ if(typeof django !== 'undefined' && typeof django.jQuery !== 'undefined' )
e.stopImmediatePropagation(); e.stopImmediatePropagation();
// remove focus from clicked link // remove focus from clicked link
$(this).blur(); linkEl.blur();
// use the clicked link id as iframe name // use the clicked link id as iframe name
// it will be available as window.name in the loaded iframe // it will be available as window.name in the loaded iframe
var iframeName = $(this).attr('id'); var iframeName = linkEl.attr('id');
// var iframeName = String(window.name + '____' + $(this).attr('id'));
// console.log('open modal with name: "' + iframeName + '"');
// browsers stop loading nested iframes having the same src url
// create a random parameter and append it to the src url to prevent it
var iframeSrcRandom = String(Math.round(Math.random() * 999999));
var iframeSrc = href; var iframeSrc = href;
// fix for django 1.7 if (e.data.lookup !== true)
if( iframeSrc.indexOf('_popup=1') == -1 ){ {
iframeSrc += '&_popup=1'; // browsers stop loading nested iframes having the same src url
// create a random parameter and append it to the src url to prevent it
// this workaround doesn't work with related lookup url
var iframeSrcRandom = String(Math.round(Math.random() * 999999));
if( iframeSrc.indexOf('?') === -1 ){
iframeSrc += '?_modal=' + iframeSrcRandom;
} else {
iframeSrc += '&_modal=' + iframeSrcRandom;
}
} }
iframeSrc += '&_modal=' + iframeSrcRandom; // fix for django 1.7
if (iframeSrc.indexOf('_popup=1') === -1) {
if (iframeSrc.indexOf('?') === -1) {
iframeSrc += '?_popup=1';
} else {
iframeSrc += '&_popup=1';
}
}
// build the iframe html // build the iframe html
// var iframeHTML = '<iframe id="related-modal" name="' + iframeName + '" src="' + iframeSrc + '"></iframe>';
var iframeHTML = '<iframe id="related-modal-iframe" name="' + iframeName + '" src="' + iframeSrc + '"></iframe>'; var iframeHTML = '<iframe id="related-modal-iframe" name="' + iframeName + '" src="' + iframeSrc + '"></iframe>';
// create the iframe jquery element // create the iframe jquery element
var iframeEl = $(iframeHTML); var iframeEl = $(iframeHTML);
if (e.data.lookup === true)
{
// set current window as iframe opener because
// the callback is called on the opener window
iframeEl.load(function(){
var iframeObj = $(this).get(0);
var iframeWindow = iframeObj.contentWindow;
iframeWindow.opener = window;
});
}
// the modal css class // the modal css class
var iframeInternalModalClass = 'related-modal'; var iframeInternalModalClass = 'related-modal';
// if the current window is inside an iframe, it means that it is already in a modal, // if the current window is inside an iframe, it means that it is already in a modal,
// append an additional css class to the modal to offer more customization // append an additional css class to the modal to offer more customization
if( window.top != window.self ) if (window.top != window.self) {
{
iframeInternalModalClass += ' related-modal__nested'; iframeInternalModalClass += ' related-modal__nested';
} }
@ -79,10 +118,14 @@ if(typeof django !== 'undefined' && typeof django.jQuery !== 'undefined' )
// django 1.7 compatibility // django 1.7 compatibility
$('a.add-another').removeAttr('onclick'); $('a.add-another').removeAttr('onclick');
$('a.add-another').click( presentRelatedObjectModal ); $('a.add-another').click({ lookup:false }, presentRelatedObjectModal);
// django 1.8 and above // django 1.8 and above
$('a.related-widget-wrapper-link').click( presentRelatedObjectModal ); $('a.related-widget-wrapper-link').click({ lookup:false }, presentRelatedObjectModal);
// raw_id_fields support
$('a.related-lookup').unbind('click');
$('a.related-lookup').click({ lookup:true }, presentRelatedObjectModal);
}); });
})(django.jQuery); })(django.jQuery);