모달 showmodaldialog

원문 : O'Reilly의 JavaScript and DHTML Cookbook

 

window.showModalDialog와 window.showModelessDialog 는 modal window가 보이는 동안 script 프로세싱을 중단시키고, modal window가 닫히면 계속 처리됩니다.

 

개인적인 생각으로는 Web의 통제권이 완전히 modal창으로 넘어가서 window.open 처럼 다른 화면이 아닌 단일창처럼 보여지는게 아닌가 생각됩니다. 결국 main창과 modal창은 다른 window지만 modal창이 main창의 프로세싱을 넘겨받아서 main창의 작업을 중단시켜 놓는것이 아닌가 생각됩니다.

 

사용법

   var dialogAnswer = window.showModalDialog(팝업.html, 모달명, 옵션);

 

modal창과 main창은 서로 다른 창이기 때문에 main창의 값을 읽기 위해서 window.dialogArguments property를 사용합니다.

 

modal창에서 main창으로 값을 넘기기 위해서는 window.returnValue property를 사용합니다.

 

Properties for showModalDialog( ) and showModelessDialog( )

Property	Value	Default	Description
center	yes | no | 1 | 0 | on | off	yes	Center the dialog
dialogHeight	Length/units	n/a	Outer height of dialog (must be >200 for IE/Mac)
dialogLeft	Integer	n/a	Left pixel offset (overrides center)
dialogTop	Integer	n/a	Top pixel offset (overrides center)
dialogWidth	Length/units	n/a	Outer width of dialog (must be >200 for IE/Mac)
edge	raised | sunken	raised	Transition style between border and content area
help	yes | no | 1 | 0 | on | off	yes	Display help icon in titlebar
resizable	yes | no | 1 | 0 | on | off	no	Dialog is resizable
status	yes | no | 1 | 0 | on | off	yes	Display status bar