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에 자바스크립스 메소드를 지정해주면 된다.