79 lines
3.8 KiB
PHP
79 lines
3.8 KiB
PHP
<!-- 처음 호출할때 사용법
|
|
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#create_action_form" data-src="시작URL">시작</button>
|
|
-->
|
|
<!-- 동적으로 ifram src 바꾸고싶을때
|
|
<span data-bs-toggle="modal" data-bs-target="#create_action_form" data-src="바꾸고싶은URL" style="cursor:pointer;">바꾸기</span>
|
|
-->
|
|
<div id="create_action_form" class="create_action_form modal fade" tabindex="-1" aria-labelledby="iframe_modal_label"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable"> <!-- modal-lg는 모달 크기를 크게 설정 -->
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="iframe_modal_label">
|
|
<?= ICONS['DESKTOP'] ?>
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" onClick="window.location.reload()"></button>
|
|
</div>
|
|
<div class="modal-body" style="max-height: 80vh; overflow-y: auto;">
|
|
<iframe id="form-container" src="about:blank" width="100%" frameborder="0" allowfullscreen></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Modal이 열릴 때 iframe의 src를 설정 -->
|
|
<script>
|
|
function resizeIframe() {
|
|
var iframe = document.getElementById('form-container');
|
|
// iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 'px';
|
|
iframe.style.height = '500px';
|
|
}
|
|
|
|
function closeBootstrapModal() {
|
|
var modalElement = document.getElementById('create_action_form'); // 모달의 실제 DOM 요소 가져오기
|
|
var modalInstance = bootstrap.Modal.getInstance(modalElement); // 모달 인스턴스 가져오기
|
|
if (modalInstance) {
|
|
modalInstance.hide(); // 모달 닫기 (hide() 메서드 사용)
|
|
} else {
|
|
console.error("Modal instance not found.");
|
|
}
|
|
// iframe src를 초기화하거나 완전히 제거
|
|
const iframe = document.getElementById('form-container');
|
|
iframe.remove(); // DOM에서 완전히 제거
|
|
// 새 iframe 다시 생성 (깨끗한 상태로 초기화)
|
|
const newIframe = document.createElement('iframe');
|
|
newIframe.id = 'form-container';
|
|
newIframe.src = 'about:blank';
|
|
newIframe.width = '100%';
|
|
newIframe.frameBorder = '0';
|
|
newIframe.allowFullscreen = true;
|
|
// body에 다시 추가
|
|
document.querySelector('#create_action_form .modal-body').appendChild(newIframe);
|
|
// 부모창만 리로드
|
|
window.location.reload();
|
|
}
|
|
|
|
var create_action_form = document.getElementById('create_action_form');
|
|
create_action_form.addEventListener('show.bs.modal', function(event) {
|
|
var button = event.relatedTarget;
|
|
var iframe = document.getElementById('form-container');
|
|
iframe.src = button.getAttribute('data-src');
|
|
// iframe이 로드된 후 높이를 조정하는 이벤트 리스너 추가
|
|
iframe.onload = function() {
|
|
resizeIframe();
|
|
var iframeContent = iframe.contentDocument || iframe.contentWindow.document;
|
|
// 컨텐츠 변경 시 높이 재조정을 위한 MutationObserver 설정
|
|
var observer = new MutationObserver(resizeIframe);
|
|
observer.observe(iframeContent.body, {
|
|
attributes: true,
|
|
childList: true,
|
|
subtree: true
|
|
});
|
|
};
|
|
});
|
|
|
|
// 모달이 닫힐 때 iframe src를 초기화하여 종료 처리
|
|
create_action_form.addEventListener('hidden.bs.modal', function() {
|
|
var iframe = document.getElementById('form-container');
|
|
iframe.src = "about:blank"; // 모달 닫힐 때 iframe 초기화
|
|
});
|
|
</script>
|