웹마당넷 |JSP 팝업창에 Form 태그내의 값 넘기기

JSP/Servlet

제 목

JSP 팝업창에 Form 태그내의 값 넘기기

작성자

웹마당넷

등록일

2008-12-19 19:56:47

조회수

30,093

[JSP 팝업창에 Form 태그내의 값 넘기기]

이 예제는 폼태그 내에 있는 INPUT 태그 값을 팝업창(window)에 넘기는 짧은 팁으로 JSP보다는 자바스크립트 쪽 팁에 가깝습니다. 아래 예제에서는 INPUT 태그가 사용되었지만, 그 외의 태그(CHECKBOX,SELECTBOX....등등)들도 동일한 방법으로 사용 가능합니다.

아래쪽은 팝업창을 호출하는 오프너(Opener) 페이지의 소스입니다.

<html>
<head>
<title>www.webmadang.net</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<style type="text/css">

</style>
<script type="text/javascript">
<!--
function openPopup1(){

var uid = document.form.mem_uid.value;
var url = "uidconfirm.jsp?uid=" + uid;
window.open( url, "idcheck", "top=200, left=200, toolbar=no, menubar=no, scrollbars=yes, resizable=no, width=300, height=70" );

}

function openPopup2(){

var uid = document.getElementsByName('mem_uid')[0].value;
var url = "uidconfirm.jsp?uid=" + uid;
window.open( url, "idcheck", "top=200, left=200, toolbar=no, menubar=no, scrollbars=yes, resizable=no, width=300, height=70" );

}
//-->
</script>
</head>
<body>
<form name="form" method="post">
<table width="420" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50"> 아이디</td>
<td width="160">  
<input type="text" name="mem_uid" size="20" maxlength="20"> </td>
<td width="90"> 
<input name="button" type="button" value="form전송" onClick="openPopup1();"></td>
<td width="120"> 
<input name="button" type="button" value="element전송" onClick="openPopup2();"></td>
</tr>
</table>
</form>
</body>
</html>

위에서 붉은 색으로 처리된 부분이 핵심입니다. 폼네임을 이용해서 INPUT 태그의 값에 접근한 뒤, 그 값을 오픈될 팝업
창의 이름 뒤에 붙여서 GET 방식으로 전달하면 끝입니다. 폼태그가 사용되지 않았다면 getElementsByName 이나 getElementById 를 이용할 수도 있습니다. openPopup2() 함수는 폼태그를 사용하지 않고 getElementsByName 을 이용했을 뿐 처리 결과는 openPopup1() 함수와 같습니다.

※ Get 방식으로 전송을 할 시에는 한글이나, 공백이 사용된 경우 Encoding 을 해주는 것이 바람직합니다.

아래는 팝업창(팝업페이지)쪽의 소스입니다. 뭐 값을 받는 기초적인 방법이니 더 이상의 설명은 필요 없을듯 합니다.

<%@ page contentType="text/html;charset=euc-kr"%>
<%
   String uid = request.getParameter("uid");
   uid = new String(uid.getBytes("ISO-8859-1"),"euc-kr");
   out.println("<center>넘어온 아이디는 <b>"+uid + "</b>입니다.</center>");
%>

※ PHP 또는 ASP 라면 "var url = "uidconfirm.jsp?uid=" + uid;" 중 확장자만 해당 페이지에 맞게 바꾸면 됩니다.

php 팝업창(팝업페이지) 소스

<?
echo "넘어온 아이디는 <b>$uid</b> 입니다.";
? >

작성자: 웹마당넷(webmadang@webmadang.net) http://www.webmadang.net