opener 부모창에 대한 접근이 안됩니다...ㅜㅜ 채택완료

모달창과 iframe의 DOM 구조 문제로 인해 발생하는 증상입니다.

opener 객체는 window.open()을 열었을 때만 부모 창을 참조할 수 있습니다.

그러나 모달은 기존 페이지 내에서 생성되므로 opener를 사용할 수 없습니다.

따라서, iframe 내에서 부모 문서를 새로고침하려면 parent 또는 top 객체를 사용해야 합니다.

하지만, 현재 모달창 내부의 iframe에서 부모 문서를 새로고침하려는 경우,

top.location.reload();론 전체 페이지가 새로고침되면서 모달도 닫히는 문제가 발생합니다.

parent.location.reload();로 모달을 유지하면서 부모 문서만 새로고침할 수 있습니다.

1. index.php 예시 코드

<button id="openModal">최신글 보기</button>

<div id="myModal" style="display:none;">
    <form action="write_update.php" method="post" target="myiframe">
        <input type="text" name="content">
        <button type="submit">작성</button>
    </form>
</div>

<!-- iframe (서버 응답을 처리할 용도) -->
<iframe name="myiframe" style="display:none;"></iframe>

<script>
// 모달 열기 버튼 클릭 시 상태 저장
document.getElementById('openModal').addEventListener('click', function() {
    document.getElementById('myModal').style.display = 'block';
    sessionStorage.setItem("modalOpen", "yes"); // 모달이 열려 있음을 저장
});

// 부모 페이지가 새로고침될 때 모달 상태 유지
window.onload = function() {
    if (sessionStorage.getItem("modalOpen") === "yes") {
        document.getElementById('myModal').style.display = 'block';
    }
};

// 모달 닫기 (ESC 키로 닫기)
document.addEventListener('keydown', function(event) {
    if (event.key === "Escape") {
        document.getElementById('myModal').style.display = 'none';
        sessionStorage.removeItem("modalOpen"); // 모달 상태 초기화
    }
});
</script>

2. 처리 완료 후 index.php만 새로고침 (write_update.php에서 실행)

<?php
echo "<script>parent.location.reload();</script>";