티스토리 뷰

프로그래밍/Front (HTML, CSS, JS)

[JavaScript] 새로 띄운 창의 데이터를 현재 창으로 가져오기

꼬렙 2011. 8. 11. 20:28
728x90
현재 창의 게시물에서 [수정] 버튼을 누르면 새창을 띄워서 비밀번호가 맞는지 확인해서 맞으면 수정 화면으로 보내주고
틀리면 비밀번호가 틀리다는 메세지를 띄워주는 방법이다

[원래 창]

[스크립트 부분]
<script language="JavaScript">

        function passwordCheck() {

window.open("/Spring_BBS/password_check.chobo", "", 

"width=400, height=200, history=no, resizable=no, status=no, scrollbars=no");

}

function inputPassword(password) {

if(${boardBean.password} == password) {

document.frm.submit();

} else {

alert("비밀번호를 다시 확인해 주세요");

}

}


function modifyArticle() {
document.frm.action = "/Spring_BBS/modify.chobo";
passwordCheck();
}

</script>

[버튼 부분]
<input type="button" value="수정" onClick="modifyArticle()" /> 

document.frm.action = "/Spring_BBS/modify.chobo";
=> 수정 / 삭제 등 여러 액션이 있을수 있으므로 먼저 액션을 지정해 주고 비밀번호를 체크 한다


window.open("/Spring_BBS/password_check.chobo", "", 

"width=400, height=200, history=no, resizable=no, status=no, scrollbars=no");

=> window.open 이라는 문법을 사용해서 새창을 띄워준다 //  window.open("URI", "ID",  "OPTION")


function inputPassword(password) {

if(${boardBean.password} == password) {

document.frm.submit();

} else {

alert("비밀번호를 다시 확인해 주세요");

}

}

=> 새로 띄운 창에서 값을 넘겨받을 함수


[새 창]

<head>

<script language="JavaScript">

<!--

function inputPassword() {

var password = document.frm.pass.value;

window.opener.inputPassword(password);

self.close();

}

-->

</script>

</head>

<body>

<form method="get" name="frm">

<table border="2" align="center">

<tr>

<td align="center">

비밀번호를 입력하세요

</td>

</tr>

<tr>

<td align="center">

<input type="password" name="pass" />

<input type="button" value="확인" onClick="inputPassword()" />

</td>

</tr>

</table>

</form>

</body>



=> 비밀번호를 입력하고 버튼을 누르면 inputPassword() 함수를 실행한다

function inputPassword() {

var password = document.frm.pass.value;

window.opener.inputPassword(password);

self.close();

}

=> document.frm.pass.value 로 입력된 값을 읽어오고
    window.opener.inputPassword(password) 로 입력된 값을 원래 창의 함수로 넘겨주고 새창을 닫아 버린다
    가장 핵심이 되는 부분이다 window.opener.inputPassword(password) 

DB에 접속해서 원래 비밀번호를 읽어오는 부분은 생략 ㅎ

어쨌든 그래서 결과 화면이다..

[리스트]


[글 읽기]


[새로 띄운 창]


[비밀번호가 맞을 경우 수정 화면]


[비밀번호가 틀릴 경우]












'프로그래밍 > Front (HTML, CSS, JS)' 카테고리의 다른 글

[JavaScript] 마우스 오른쪽 버튼 클릭, 마우스 드래그, 키보드 블럭 지정 막기  (0) 2011.08.22
[JavaScript] 자바스크립트 문자열 넘기기 (숫자로 넘길때 처리 안됨)  (2) 2011.08.12
[JavaScript] 버튼 랜덤 이동  (0) 2011.08.09
[JavaScript] 스크립트 코드의 위치  (0) 2011.08.07
[JavaScript] 롤오버 만들기  (0) 2011.08.07