동적으로 select박스 생성할때,

1,341 views
Skip to first unread message

안미라

unread,
Oct 14, 2009, 10:51:30 PM10/14/09
to ks...@googlegroups.com

오늘 몹시 춥네요.

개발은 잘 안풀리고, 게다가 추우니까 졸립고, 사면초가입니다 ㅜㅜ

 

저좀 사면초가에서 구해주세요~~

 

질문들어갑니다.

 

jsp에서 select box 만들때

       <form:select path="homepCode">

                <form:options items="${ HOMEP_CODE }" itemValue="code_id" itemLabel="code_nm"/>

         </form:select>

이런식으로 만들면 되는데

문제는 코드를 추가 버튼을 클릭할 동적으로 생성하고 싶은거에요.

        Function addRow(){

         …….

              el_select = document.createElement("select");

              with(el_select) {path="searchHomepCode";id="select";}

              col3.appendChild(el_select);

              element = document.createElement("options");

              with(element) {items="${HOMEP_CODE}";itemValue="code_id";itemLabel="code_nm";}

              document.getElementById("select").appendChild(element);

}

 

이런식으로 해서 select 모양새는 갖추었는데 option 내용이 출력이 안되요.

 

저런걸 EL이라고 하던가요? 동적으로 생성할 EL 함께 쓰려면 어떻게 해야할까요?

고수님들 도움 부탁드립니다.

Toby Lee

unread,
Oct 14, 2009, 11:07:36 PM10/14/09
to ks...@googlegroups.com
<form:과 같은 커스톰태그와 EL등은 서버에서 동작하는 것이고, 작성하신 자바스크립트를 이용한 동적인 추가는 브라우저에서 일어나는 것입니다. 따라서 동적으로 태그와 EL 등을 넣는다고 그게 동작하지 않죠. 이미 서버의 손을 떠났으니까요.

이런 경우라면 

1. 미리 <form: 부분을 다 돌려서 가져오되 화면에는 보이지 않게 하고 있다가 추가버튼을 누르면 보이게 하거나
2. options에 들어갈 내용을 자바스크립트의 array등에 따로 담아두었다가, element를 추가하는 중에 그 정보를 사용해서 뿌려주는 것
3. 아니면 AJAX를 써서 다시 서버에 요청을 해서 해당 부분의 HTML을 받거나 options 항목을 받아서 보여주는 것

등이 있을 것입니다.

이게 <form: 태그들을 썼다면 단순히 select 박스를 뿌려주는 것 뿐 아니라 모델의 값과 비교해서 디폴트 option을 선택해주는 것, 또 폼을 submit했을 경우 오류가 있다면 에러메시지를 보여주는 것 등등의 복잡한 작업도 같이 하고 있습니다. 따라서 자바스크립트로 단순 HTML태그를 만드는 것으로는 원래 서버에서 동작하는 것과 같은 기능을 만들기는 간단치 않습니다.

단순 입력폼이라 <form>태그가 없어도 동작할 수 있는 것이라면 뭐 상관없겠지만요.

상세한 구현 방법은 미투데이와와 xper에서 열심히 활동하시는 회장님이 좀 알켜주시죠?

2009/10/15 안미라 <aclim...@gmail.com>

Toby Lee

unread,
Oct 14, 2009, 11:08:24 PM10/14/09
to ks...@googlegroups.com
미투데이와와 xper에서 열심히 활동하시는 회장님이 좀 알켜주시죠?

아차! 이화모임을 빼먹었네요. 

2009/10/15 Toby Lee <toby...@gmail.com>

안미라

unread,
Oct 15, 2009, 3:44:15 AM10/15/09
to ks...@googlegroups.com

감사합니다.

말씀을 들어보니 당연한 것을이렇게 무개념으로 개발을 하니 참 손발이 고생이 많습니다.

 

생성된 element 삭제 기능도 있어 1번은 복잡해 질 것 같고 하여 간략히 2번으로 해결봤습니다.

~~ 감사합니다~

Sewon Ann

unread,
Oct 15, 2009, 4:20:44 AM10/15/09
to ks...@googlegroups.com
해결을 축하드립니다~!

덤으로 prototype 이나 jQuery 같은 자바스크립트 라이브러리를 사용하면 작업을 좀 더 편하게 하실 수 있을 거에요. 전 jQuery 는 안써보고 prototype 만 써 봤는데 이젠 이거 없으면 js 작업 못할 것 같아요.

2009/10/15 안미라 <aclim...@gmail.com>

안미라

unread,
Oct 15, 2009, 4:23:20 AM10/15/09
to ks...@googlegroups.com

.참고하겠습니다.

꼭 사용해 봐야징~

JungWoo Kim(Miracle)

unread,
Oct 15, 2009, 5:46:24 AM10/15/09
to ks...@googlegroups.com
jQuery.. prototype 없이 자바스크립트 관련 프로그래밍을 해야할 때는 정말 막막해요.. ㅠ.ㅠ

예전에는 없어도 어찌 돌아가는 페이지를 만들었는데.. 이제는.. ㅠ.ㅠ

"頼るな、勝ち取れ。さすれば与えられ。"
[ 기다리지 마라!  쟁취하라! 그러면 주어질 것이다. ]


2009/10/15 안미라 <aclim...@gmail.com>

Toby Lee

unread,
Oct 15, 2009, 7:15:48 AM10/15/09
to ks...@googlegroups.com
jQuery.. prototype 없이 자바스크립트 관련 프로그래밍을 해야할 때는 정말 막막해요.. ㅠ.ㅠ

스프링없이 자바 프로그래밍을 해야할 때도 정말 막막해요.. 


2009/10/15 JungWoo Kim(Miracle) <kmir...@gmail.com>
Reply all
Reply to author
Forward
0 new messages