모달창 만들고 값 주고 받기

// 본문에 들어갈 자바스크립트 /////////////////////////////////////////////////

<script language="javascript" type="text/javascript">
    // 모달 팝업창 띄우기
    function fnOpen(url) {

        var win, opt;

 

        // 전체화면 예제

        //opt = "dialogHeight:"+ (screen.availHeight-30) +"; dialogWidth:"+ (screen.availWidth) +";dialogLeft:0px;dialogTop:0px;resizable:no;status:no;scroll:no;help:no;unadorned:no;edge:sunken";

 

        opt = "help=no;dialogWidth=350px;dialogHeight:230px; center:yes; status:no; resizable:no; scrollbar:no";

        win=window.showModalDialog(url,"myWin",opt);

        setVal(win);
    }

 

    // 모달 창에서 넘어온 값을 분배
    function setVal(result) {
        var f = document.frmGoods;
        var strMsg = result.split(",");

 

        strMsg[1] = strMsg[1].replace(" (", "");
        strMsg[1] = strMsg[1].replace(" )", "");

 

        orderW.innerHTML  = strMsg[0];   // 첫번째 배열 값
        orderNP.innerHTML = strMsg[1];  // 두번째 배열 값

 

        f.tpay.value = strMsg[1];      // input box에 삽입
    }
</script>

 

// 본문에 들어갈 html 코드 ////////////////////////////////////////////////////
<a href="javascript:fnOpen('modal.htm');">모달</a>

 

혹은
<input type="radio" name="delivery_chk" id="oops" value="1" on_click="javascript:fnOpen('modal.htm');" on_focus="blur();">

<Label for="oops" on_focus="blur();">모달</Label>

 

응용은 어떤식으로든 가능하다.

 

 

 

// 모달창에 들어갈 자바스크립트 /////////////////////////////////////////
<script language="javascript" type="text/javascript">
    function init() {
        var f = document.frmPayments;

 

        result  = f.fCate.value +" -> ";        // input box의 값을 가져온다.
        result += f.midCate.value;

 

        if ( f.faster.checked == true ) result += "|2";     // delimiter로 '|' 를 사용
        else result += "|1";

 

        window.returnValue = result;        // 값을 넘긴다.
    }
</script>

 

 

※ 부모창의 함수나 값을 참조하기 위한 방법

1. 먼저 부모창에서 모달창을 열때 창 이름을 window 로 지정해야 한다.

    win = window.showModalDialog(url,window,opt);

 

여기서 url 과 opt 는 이미 선언한 변수이지만..

window 는 예약어 이다.

 

 

2. 모달창에서 부모창을 참조하기 위해 다음과 같이 한다.

    var doc= dialogArguments;   // 부모창의 id 를 받는다.

    var doc= doc.frmView;

    doc.xPath.value = "ABCD";      // 값을 할당한다.

    xSQL.value = doc.xPath.value;   // 값을 받아 온다.

 

이렇게 하면 부모창의 xPath 라는 필드에 "ABCD" 가 들어가게 된다.

반대로 하면 값을 가져올 수도 있다.