$(function() { var $el = $("#id_date"); var opts = {"minDate": "2026-09-07", "inline": true, "locale": "nb", "format": "DD.MM.YYYY"}; var $modal = $el.closest('.modal'); // Host the widget in a zero-sized position:relative div on // so it escapes any clipping/transformed ancestor and so the // library's "must be inside relative parent" check passes. var ensureDtpHost = function ($container) { var $host = $container.children('.__dtp_host__').first(); if (!$host.length) { $host = $('') .css({ position: 'relative', width: 0, height: 0 }) .appendTo($container); } return $host; }; var getDtpHostContainer = function () { return $('body'); }; if (!opts.inline && opts.widgetParent === undefined) { opts.widgetParent = ensureDtpHost(getDtpHostContainer()); } $el.datetimepicker(opts); if (opts.inline) return; // jQuery UI .position() is a SETTER (different from jQuery core's // read-only .position()). Detect by checking arity / ui presence. var hasJqUiPosition = !!($.ui && $.ui.position) || ($.fn.position && $.fn.position.length > 0); var rafId = null; var $w = null; var domObserver = null; var anchorDetached = function () { return !document.documentElement.contains($el[0]); }; var teardown = function () { var api = $el.data('DateTimePicker'); // hide() removes the body-hosted widget and fires dp.hide. if (api && typeof api.hide === 'function') { try { api.hide(); } catch (e) { /* manual cleanup below */ } } // Safety net if dp.hide never fired (anchor already gone): // remove only THIS picker's widget. The .__dtp_host__ is shared // across floating pickers, so never blanket-remove every widget // in it — that could kill a popup another open picker owns. if ($w && $w.length) { $w.remove(); $w = null; } window.removeEventListener('scroll', onScroll, true); window.removeEventListener('resize', onScroll); if ($modal.length) $modal.off('drag.dtp', onScroll); if (rafId) { window.cancelAnimationFrame(rafId); rafId = null; } if (domObserver) { domObserver.disconnect(); domObserver = null; } }; var manualPlace = function () { if (!$w || !$w.length) return; var elRect = $el[0].getBoundingClientRect(); var wh = $w.outerHeight(); var ww = $w.outerWidth(); var top, left; if ($modal.length) { var mRect = $modal[0].getBoundingClientRect(); top = elRect.bottom - mRect.top + $modal.scrollTop(); left = elRect.left - mRect.left + $modal.scrollLeft(); } else { top = elRect.bottom + window.pageYOffset; left = elRect.left + window.pageXOffset; } if (elRect.bottom + wh > window.innerHeight && elRect.top >= wh) { top -= (elRect.height + wh); } var maxLeft = ($modal.length ? $modal[0].getBoundingClientRect().right - ww - 8 : window.pageXOffset + window.innerWidth - ww - 8); if (left > maxLeft) left = maxLeft; $w.css({ top: top + 'px', left: left + 'px', bottom: 'auto', right: 'auto' }); }; var place = function () { if (!$w || !$w.length) return; if (hasJqUiPosition) { try { $w.position({ my: 'left top', at: 'left bottom+2', of: $el, collision: 'flipfit', within: window }); return; } catch (e) { /* fall through */ } } manualPlace(); }; var onScroll = function () { if (rafId) return; rafId = window.requestAnimationFrame(function () { rafId = null; if (!$w || !$w.length) return; var rect = $el[0].getBoundingClientRect(); // A detached or zero-sized anchor reports an all-zero rect; // treat it as off-screen so a stranded widget is dismissed // instead of being parked at the top-left corner (RSK-332). if (anchorDetached() || (rect.width === 0 && rect.height === 0) || rect.bottom window.innerHeight || rect.right window.innerWidth) { var api = $el.data('DateTimePicker'); if (api && typeof api.hide === 'function') api.hide(); return; } place(); }); }; $el.on('dp.show', function () { var $host = getDtpHostContainer().children('.__dtp_host__').first(); $w = $host.children('.bootstrap-datetimepicker-widget').last(); if (!$w.length) { $w = $('.bootstrap-datetimepicker-widget').last(); } if (!$w.length) return; // In a modal, match the highest z-index among this field's own // ancestors (its modal) and sit just above it. The body-host is // position:relative, so when it carries a z-index it forms a // stacking context: the host itself must be lifted too, or it // would trap the widget below a higher modal. var targetZ = 10000; if ($modal.length) { var maxZ = 0; $el.parents().each(function () { var z = parseInt($(this).css('z-index'), 10); if (!isNaN(z) && z > maxZ) maxZ = z; }); targetZ = (maxZ || 1050) + 1; } $host.css('z-index', targetZ); $w.css({ position: 'absolute', zIndex: targetZ }); // Body-hosted widget: stop clicks from reaching the modal // (BS3 close-on-outside-click) or jQuery UI draggable (which // can interpret mousedown as drag-start on the modal). $w.off('.dtpstop').on('mousedown.dtpstop click.dtpstop', function (e) { e.stopPropagation(); }); place(); window.addEventListener('scroll', onScroll, true); window.addEventListener('resize', onScroll); // jQuery UI draggable modals don't emit scroll/resize. if ($modal.length) $modal.on('drag.dtp', onScroll); // The widget lives on , so it outlives its anchor input // when an AJAX form/panel re-render detaches it. Watch for that // removal and tear the orphan down (RSK-332). if (window.MutationObserver && !domObserver) { domObserver = new window.MutationObserver(function () { if (anchorDetached()) teardown(); }); domObserver.observe(document.body, { childList: true, subtree: true }); } }); $el.on('dp.hide', function () { window.removeEventListener('scroll', onScroll, true); window.removeEventListener('resize', onScroll); if ($modal.length) $modal.off('drag.dtp', onScroll); if (rafId) { window.cancelAnimationFrame(rafId); rafId = null; } if (domObserver) { domObserver.disconnect(); domObserver = null; } // Reset the shared body-host back to its natural stacking so a // lifted z-index does not linger after this picker closes. getDtpHostContainer().children('.__dtp_host__').first() .css('z-index', ''); }); });