=================================
=================================
=================================
- 2009/03/28 자바스크립트 부모창에서 자식창으로 값을 전달하기
1. get 방식
부모창의 자바스크립트
function showMap(mapAddr){
var f = document.form;
f.mapAddr.value = encodeURL(mapAddr);
window.open("showMap.jsp?mapAddr="+mapAddr,"","width=500,height=570");
}
이 방법을 써봤지만 이방법엔 치명적인 문제점 이있다. 한글 값일 경우 넘어갈때
왜인지 모르지만 깨진다는 것이다. URL encoding을 해도 마찬가지의 경우가
벌어졌다. 그래서 좀 더 발전적인 방법을 사용해 보았다.
2. post 방식
function showMap(mapAddr){
var f = document.form;
f.mapAddr.value = encodeURL(mapAddr);
window.open("","child","width=500,height=570");
f.target = "child";
f.action = "showMap.jsp";
f.submit();
}
//----------------------------------------------------
<form name="form" action="menu.jsp" method="post">
<input type="hidden" name="mapAddr">
자바 스크립트 코드를 아시는 분들이라면 금방 이해가 되실것이다.
한글 값을 input type=hidden 인 값에 넣고 post 방식으로 전달해 버린것이다
이러면 한글도 안깨지고 무난히 해결되었다.
정말 안되서 고생 고생하다 된거라 아마도 쉽게 안잊혀질 듯 하다.
혹시나 자바스크립트 url 인코딩 함수를 원하시는 분이 계실까봐 밑에 첨부한다.
//url 인코딩
function encodeURL(str){
var s0, i, s, u;
s0 = ""; // encoded str
for (i = 0; i < str.length; i++){ // scan the source
s = str.charAt(i);
u = str.charCodeAt(i); // get unicode of the char
if (s == " "){s0 += "+";} // SP should be converted to "+"
else {
if ( u == 0x2a || u == 0x2d || u == 0x2e || u == 0x5f || ((u >= 0x30) && (u <= 0x39)) || ((u >= 0x41) && (u <= 0x5a)) || ((u >= 0x61) && (u <= 0x7a))){ // check for escape
s0 = s0 + s; // don't escape
}
else { // escape
if ((u >= 0x0) && (u <= 0x7f)){ // single byte format
s = "0"+u.toString(16);
s0 += "%"+ s.substr(s.length-2);
}
else if (u > 0x1fffff){ // quaternary byte format (extended)
s0 += "%" + (0xf0 + ((u & 0x1c0000) >> 18)).toString(16);
s0 += "%" + (0x80 + ((u & 0x3f000) >> 12)).toString(16);
s0 += "%" + (0x80 + ((u & 0xfc0) >> 6)).toString(16);
s0 += "%" + (0x80 + (u & 0x3f)).toString(16);
}
else if (u > 0x7ff){ // triple byte format
s0 += "%" + (0xe0 + ((u & 0xf000) >> 12)).toString(16);
s0 += "%" + (0x80 + ((u & 0xfc0) >> 6)).toString(16);
s0 += "%" + (0x80 + (u & 0x3f)).toString(16);
}
else { // double byte format
s0 += "%" + (0xc0 + ((u & 0x7c0) >> 6)).toString(16);
s0 += "%" + (0x80 + (u & 0x3f)).toString(16);
}
}
}
}
return s0;
}
=================================
=================================
=================================
출처: http://www.soonbo.com/zbxe/?document_srl=2991
① 부모창 (openwin.php)
<SCRIPT LANGUAGE="JavaScript">
function owin() {
str_id=f.id.value;
str_name=f.name.value;
nw=window.open("newwin.php?id="+str_id+"&name="+str_name+"&age=20","nwin","width=300,height=300,left=500,top=100, resizable");
};
function owin1(str) {
str_id=f.id.value;
str_name=f.name.value;
nw=window.open("newwin.php?id="+str_id+"&name="+str_name+"&age=20&str="+str,"nwin","width=300,height=300,left=500,top=100, resizable");
};
</SCRIPT>
부모창<br>
<br>
<br>
<form name="f">
<input type="hidden" name="name" value="홍길동">
ID : <input type="text" name="id">
<input type="button" value="자식창에 값 전달" onClick="owin();">
</form>
<br>
<A HREF="javascript:owin(">자식창에 값 전달 1</A> |
<A HREF="javascript:owin1('abc')">자식창에 값 전달 2</A>
② 자식창 (newwin.php)
<SCRIPT LANGUAGE="JavaScript">
function send1() {
opener.f.id.value=nf.id.value; //부모창에 값 전달
self.close(); //팝업창 닫기①
//window.close(); //팝업창 닫기②
}
function send2() { //부모 페이지를 새로운 페이지로 이동
opener.location.href="nf.url.value;
window.close();
}
function send3() { //부모 페이지를 새로고침
//opener.location.href="openwin.php";
opener.location.reload();
}
</SCRIPT>
자식창<br>
<?
$id=$_GET["id"];
$name=$_GET["name"];
$age=$_GET["age"];
$str=$_GET["str"];
?>
<TABLE border="0" cellspacing="1" cellpadding="1" width="150">
<TR>
<TD width="75" bgcolor="#99FFFF">ID</TD>
<TD width="75" bgcolor="#99FFFF"><?=$id?></TD>
</TR>
<TR>
<TD bgcolor="#99FFFF">NAME</TD>
<TD bgcolor="#99FFFF"><?=$name?></TD>
</TR>
<TR>
<TD bgcolor="#99FFFF">AGE</TD>
<TD bgcolor="#99FFFF"><?=$age?></TD>
</TR>
<TR>
<TD bgcolor="#99FFFF">STR</TD>
<TD bgcolor="#99FFFF"><?=$str?></TD>
</TR>
</TABLE>
<br>
<form name=nf>
<input type="text" name="url" value="http://">
<input type="button" value="부모창바꾸기" onclick="send2();">
<br>
<input type="text" name="id">
<input type="button" value="부모창에 값 전달" onclick="send1();">
<br>
<input type="button" value="부모창 새로고침" onclick="send3();">
</form>
=================================
=================================
=================================
출처: http://hoons.kr/board.aspx?Name=QAASPNET&BoardIdx=8824&Page=1&Mode=2
위 사이트들 참조하시구요.
----- 오프너 -----<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"><script type="text/javascript">
function SeChang()
{
var nice = document.getElementById("<%=txtSuper.ClientID%>").id;
var url = "a.aspx?id=" + nice;
window.open(url);
}
</script>
<asp:TextBox ID="txtSuper" runat="server" />
<a href="javascript:SeChang();">클릭하면 팝업창뜸</a>
</asp:Content>
새창에다가 텍스트박스의 아이디값을 넘겨줬어요.
------ New Window ------ (아놔 ㅋㅋ 문자썼네요...새창이라고 안하고 대단하죠?)<script type="text/javascript">
function BooMo()
{
opener.document.getElementById(''<%=Request["id"]%>'').value = "1818년2월18일";
self.close();
}
</script>
<a href="javascript:BooMo();">현재 달력에서 선택하는 날이 1818년 2월 18일</a>
새창에서는 하이~덴! 에서 부모창으로부터 넘겨받은 텍스트박스의 아이디값을 담아둔후
달력에서 해당날짜를 클릭하면
opener.document.getElementById(''<%=Request["id"]%>'').value = "1818년2월18일";
부모창으로 값을 넘겨줍니다.
자 그렇다면 우리의 Blue는 어딜 갔을까요?
-------------Blue------------
\\부모창\\
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"><script type="text/javascript">function SeChang()
{
window.open("a.aspx");
}
</script>
<input type="text" id="txtSuper" />
<a href="javascript:SeChang();">클릭하면 팝업창뜸</a></asp:Content>
\\새창\\
<script type="text/javascript">function BooMo()
{
opener.document.getElementById("txtSuper").value = "1818년2월18일";
self.close();
}
</script>
<a href="javascript:BooMo();">현재 달력에서 선택하는 날이 1818년 2월 18일</a>
제말은 3분의1만 믿으십시오.
하지만 RGB법칙을 지켰으니까 괜찮을꺼에요
=================================
=================================
=================================
'WEB > JavaScript' 카테고리의 다른 글
| 페이지 실행시 자바 스크립트 함수 실행 (0) | 2011.04.01 |
|---|---|
| window.open 으로 열린 창에 대해 닫혔는지 확인하기 (0) | 2011.04.01 |
| [POPUP] 팝업창에 Post 방식으로 값 넘기기 (1) | 2011.04.01 |
| [showModalDialog 부모에서 다이얼로그로 값 전달하기] - dialogArguments (0) | 2011.04.01 |
| asp value(값) html과 자바스크립트 넘기기 (0) | 2010.01.14 |