javascript popup post 전송 ie11

2020. 12. 8. 18:37language/javascript

 

javascript popup post 전송 ie11

 

다음과 같은 상황에서 ie11은 동작하지 않는다.

 

1. 빈 팝업을 호출
2. 부모 창에서 form 생성 (또는 기존에 form이 있음)
3. 부모 창에서 빈 팝업으로 form submit (POST)

 

기존에는 위 기능이 정상동작했고 현재 크롬에서도 이상없이 동작한다.

 

단 ie11에서는 동작하지 않았다.

 

증상은 다음과 같다.

1. 빈 팝업 호출
2. 부모창에서 빈 팝업을 target 잡고 submit 시 부모창에서 submit 이 실행됨

 

내가 구현해야할 기능(상황)은 다음과 같았다.

시스템 별로 특정 페이지를 post 로 호출해야 함. (시스템이 여러개)
따라서 시스템마다 관리 포인트를 최소화 하고 싶음.
즉, 스크립트 몇줄만 각 시스템으로 전달해서 특정 페이지를 post로 호출해야함

 

해당 현상을 구글링하면 많은 자료들이 나온다.

 

하지만 내 마음에 드는 작업들은 없었다.

 

더미 페이지를 띄우는 것부터 로컬스토리지 사용 등 여러 방식이 나온다.

 

하지만 난 관리 포인트를 최소화 하는, 즉 스크립트 몇줄로서 해결하고 싶었다.

 

여러 방식을 고려하다 아래와 같이 구현했다.

<a href="javascript:void(0);" onclick="open_new();" >팝업</a>
<script>
	function open_new(){
		var openPopup = window.open("", "openPopup");  
		var htmls = "";
		htmls = htmls + "<html>";
		htmls = htmls + "<body>";
		htmls = htmls + "<form action='이동할 주소' method='post' name='openForm' id='openForm'>";
		htmls = htmls + "<input type='hidden' name='data1' id='data1' value='data1'>";
		htmls = htmls + "<input type='hidden' name='data2' id='data2' value='data2'>";
		htmls = htmls + "</form>";
		htmls = htmls + "</body>";
		htmls = htmls + "</html>";
		openPopup.document.write(htmls);
		openPopup.document.getElementById("openForm").submit();
	}
</script>

간략히 설명하자면 다음과 같다.

 

1. 부모창에서 빈 팝업 호출

2. 빈 팝업에 html 코드 삽입(form 및 form data)

3. 빈 팝업의 form submit

 

위 방식으로 ie11, 크롬은 정상동작했다.

 

해당 방식이 꼭 정답은 아니니... 참고만 하기를...