bboks.net™

IFrame에서 상위 페이지의 필드 값 가져오기 본문

Web/HTML

IFrame에서 상위 페이지의 필드 값 가져오기

bboks.net 2010. 8. 19. 10:42
웹 프로그래밍을 하면서 IFrame에서 상위 페이지의 값을 가져와야 되는 경우가 발생한다. 이는 자바 스크립트를 이용해 해결할 수 있다.

상위페이지
<html>
<head>
    <title>제목 없음</title>
</head>
<body>
    <form name="TheForm" action="ParentPage.aspx">
        <input type="text"name="name"/>
        <input type="text" name="email"/>
    </form>
    <p>
        <iframe style="width: 500px; height: 300px;" src="Junki.aspx"></iframe>
    </p>
</body>
</html>

IFrame 내부 페이지
<html>
<head>
<title>제목없음</title>
<script type="text/javascript">
function getParentValue( )
{
    var ffrom = parent.document.TheForm;
    var fto = document.TheForm;
    for ( var e = 0; e < ffrom.elements.length; ++e )
    {
        var fld = ffrom.elements[e]; // won't work for checkboxes/radio/selects
        fto.elements[fld.name].value = fld.value;
    }
}
</script>
</head>
<body>
    <form name="TheForm" action="Junki.aspx">
        Name: <input name="name"/><br/>
        EMail: <input name="email"/><br/>
        <input type="button" name="submit" value="값 가져오기" onclick="getParentValue()"/>
    </form>
</body>
</html>

만약 페이지 로드시 가져오고 싶다면 body의 onload에 자바스크립스 메소드를 지정해주면 된다.

'Web/HTML' Related Articles more