지역 3단계로 되는 동적셀렉트좀 봐주세요...ㅠㅠㅠㅠ
대략소스는..
var sojaeji = function(sido, gugun, dong) {
var obj = this;
//window.onload = function() {
obj.sido = document.getElementById(sido);
obj.gugun = document.getElementById(gugun);
obj.dong = document.getElementById(dong);
obj.update_sido();
obj.sido.onchange = function() {
obj.update_gugun.apply(obj);
obj.update_dong.apply(obj);
}
obj.gugun.onchange = function() {
obj.update_dong.apply(obj);
}
//}
}
sojaeji.prototype = {
update_gugun : function() {
if (this.gugun == null) return;
var gugun = this[this.sido.value];
this.gugun.innerHTML = "";
for(var i=0; i<gugun.length; i++)
this.gugun.options.add(new Option(gugun[i], gugun[i]));
},
update_dong : function() {
if (this.dong == null) return;
var dong = this[this.sido.value+"->"+this.gugun.value];
this.dong.innerHTML = "";
for(var i=0; i<dong.length; i++)
this.dong.options.add(new Option(dong[i], dong[i]));
},
update_sido : function() {
if (this.sido == null) return;
var sido = this['시도'];
for(var i=0; i<sido.length; i++)
this.sido.options.add(new Option(sido[i], sido[i]));
this.update_gugun();
this.update_dong();
},
'시도' : ['지역선택','서울','부산','대구','인천','광주','대전','울산','강원','경기','경남','경북','전남','전북','제주','충남','충북'],
'지역선택' : ['세부지역1'],
'지역선택->세부지역1' : ['세부지역2'],
'서울' : ['강남구','강동구','강북구','강서구','관악구','광진구','구로구','금천구','노원구','도봉구','동대문구','동작구','마포구','서대문구','서초구','성동구','성북구','송파구','양천구','영등포구','용산구','은평구','종로구','중구','중랑구'],
'부산' : ['강서구','금정구','남구','동구',....................
<select name="sido2" id="sido2"></select>
<select name="gugun2" id="gugun2"></select>
<select name="dong2" id="dong2"></select>
<script type="text/javascript">
new sojaeji('sido2', 'gugun2', 'dong2');
</script>
대략 소스는 위와 같습니다...
긍데 수정페이지에서는 해당값이 선택되게 하여야 하는데..
도무지 방법을 모르겠습니다..
도움좀 부탁드립니다.
자바스크립트는 아직.. 잘몰라서요..
일반적인 셀렉트 선택방법으로 되질않더라구요..ㅠㅠ
꼭좀 도움좀 부탁드립니다... 아니면 좀더 쉬운 소스가 있는곳
위치좀 알려주셔도 너무 감사하구요..<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
var sojaeji = function(sido, gugun, dong) {
var obj = this;
//window.onload = function() {
obj.sido = document.getElementById(sido);
obj.gugun = document.getElementById(gugun);
obj.dong = document.getElementById(dong);
obj.update_sido();
obj.sido.onchange = function() {
obj.update_gugun.apply(obj);
obj.update_dong.apply(obj);
}
obj.gugun.onchange = function() {
obj.update_dong.apply(obj);
}
//}
}
sojaeji.prototype = {
update_gugun : function() {
if (this.gugun == null) return;
var gugun = this[this.sido.value];
this.gugun.innerHTML = "";
for(var i=0; i<gugun.length; i++)
this.gugun.options.add(new Option(gugun[i], gugun[i]));
},
update_dong : function() {
if (this.dong == null) return;
var dong = this[this.sido.value+"->"+this.gugun.value];
this.dong.innerHTML = "";
for(var i=0; i<dong.length; i++)
this.dong.options.add(new Option(dong[i], dong[i]));
},
update_sido : function() {
if (this.sido == null) return;
var sido = this['시도'];
for(var i=0; i<sido.length; i++)
this.sido.options.add(new Option(sido[i], sido[i]));
this.update_gugun();
this.update_dong();
},
'시도' : ['지역선택','서울','부산','대구','인천','광주','대전','울산','강원','경기','경남','경북','전남','전북','제주','충남','충북'],
'지역선택' : ['세부지역1'],
'지역선택->세부지역1' : ['세부지역2'],
'서울' : ['강남구','강동구','강북구','강서구','관악구','광진구','구로구','금천구','노원구','도봉구','동대문구','동작구','마포구','서대문구','서초구','성동구','성북구','송파구','양천구','영등포구','용산구','은평구','종로구','중구','중랑구'],
'부산' : ['강서구','금정구','남구','동구',....................
<select name="sido2" id="sido2"></select>
<select name="gugun2" id="gugun2"></select>
<select name="dong2" id="dong2"></select>
<script type="text/javascript">
new sojaeji('sido2', 'gugun2', 'dong2');
</script>
대략 소스는 위와 같습니다...
긍데 수정페이지에서는 해당값이 선택되게 하여야 하는데..
도무지 방법을 모르겠습니다..
도움좀 부탁드립니다.
자바스크립트는 아직.. 잘몰라서요..
일반적인 셀렉트 선택방법으로 되질않더라구요..ㅠㅠ
꼭좀 도움좀 부탁드립니다... 아니면 좀더 쉬운 소스가 있는곳
위치좀 알려주셔도 너무 감사하구요..<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
댓글 1개
14년 전
한 큐에 모든 걸 올리려고 하면 한꺼번에 보내는 데이터가 너무 많게 됩니다. 되도록이면 Ajax로 처리하세요.
게시글 목록
| 번호 | 제목 |
|---|---|
| 1720 | |
| 1718 | |
| 1716 |
HTML
아이프레임과 css 질문입니다.,
1
|
| 1711 |
HTML
기초적인 css 질문요..
4
|
| 1710 | |
| 1707 |
HTML
인터넷익스플로러 6 에서 깨지네요
2
|
| 1704 |
HTML
레이어 질문 드립니다.
2
|
| 1700 |
HTML
웹표준에 대해서^^;;
3
|
| 1693 | |
| 1689 |
HTML
WebKit 이게 무엇인가요?
3
|
| 1687 |
HTML
css 질문드립니다.
1
|
| 1686 |
HTML
메인페이지 최근사진 엑박 뜨는데요
|
| 1683 | |
| 1680 | |
| 1676 | |
| 1675 | |
| 1674 |
HTML
css3 질문인데요..
|
| 1671 |
HTML
background 반복질문 ㅠㅠ
2
|
| 1667 |
HTML
플래시를 수정해서 넣었는데
3
|
| 1655 |
HTML
지적 부탁드립니다.
11
|
| 1649 | |
| 1646 | |
| 1641 | |
| 1638 | |
| 1636 |
HTML
스크롤바 관련 질문드려요..
1
|
| 1633 | |
| 1631 |
HTML
웹표준 질문이요^^
1
|
| 1627 | |
| 1624 | |
| 1623 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기