묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
다중셀렉트 질문있어서 글올립니다.
2015.07.20 11:35
안녕하세요. 무식하게 코딩하는 사람입니다.
제가 요번에 다중셀렉트를 만들고 있는데
그냥 검색으로 좋은 소스를 찾았습니다.
3단계까지 다중으로 셀렉할 수 있는데요.
<FORM name="isc">
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td nowrap height="11">
<select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
<option selected>---선택 1----------</option>
<option>서브 1-1</option>
<option>서브 1-2</option>
</select>
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td nowrap height="11">
<select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
<option selected>---선택 1----------</option>
<option>서브 1-1</option>
<option>서브 1-2</option>
</select>
<select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)">
<option value=" " selected>---선택2-----------</option>
</select>
<option value=" " selected>---선택2-----------</option>
</select>
<select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)">
<option value=" " selected>---선택3-------------</option>
</select>
<option value=" " selected>---선택3-------------</option>
</select>
<script>
<!--
var groups=document.isc.example.options.length
var group=new Array(groups)
<!--
var groups=document.isc.example.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group[i]=new Array()
group[i]=new Array()
group[0][0]=new Option("---Select2---"," ");
group[1][0]=new Option("서브 1-1-1"," ");
group[1][1]=new Option("서브 1-1-2","47");
group[1][2]=new Option("서브 1-1-3","46");
group[1][3]=new Option("서브 1-1-4","45");
group[1][1]=new Option("서브 1-1-2","47");
group[1][2]=new Option("서브 1-1-3","46");
group[1][3]=new Option("서브 1-1-4","45");
group[2][0]=new Option("서브 1-2-1"," ");
group[2][1]=new Option("서브 1-2-2","115");
group[2][2]=new Option("서브 1-2-3","116");
group[2][1]=new Option("서브 1-2-2","115");
group[2][2]=new Option("서브 1-2-3","116");
var temp=document.isc.stage2
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
var secondGroups=document.isc.stage2.options.length
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
secondGroup[0][0][0]=new Option("---Select 3---"," ");
secondGroup[1][0][0]=new Option("---Select 3---"," ");
secondGroup[1][1][0]=new Option("Now Select This One"," ");
secondGroup[1][1][1]=new Option("Website Abstraction","http://www.blueb.co.kr/");
secondGroup[1][1][2]=new Option("Javascript for the non programmer","http://www.blueb.co.kr/");
secondGroup[1][1][3]=new Option("Java-scripts.net","http://www.blueb.co.kr/");
secondGroup[1][0][0]=new Option("---Select 3---"," ");
secondGroup[1][1][0]=new Option("Now Select This One"," ");
secondGroup[1][1][1]=new Option("Website Abstraction","http://www.blueb.co.kr/");
secondGroup[1][1][2]=new Option("Javascript for the non programmer","http://www.blueb.co.kr/");
secondGroup[1][1][3]=new Option("Java-scripts.net","http://www.blueb.co.kr/");
secondGroup[1][2][0]=new Option("Now Select This One"," ");
secondGroup[1][2][1]=new Option("Dynamic Drive","http://www.blueb.co.kr/");
secondGroup[1][2][2]=new Option("Beginner\'s Guide to DHTML","http://www.blueb.co.kr/");
secondGroup[1][2][3]=new Option("Web Coder","http://www.blueb.co.kr/");
secondGroup[1][2][1]=new Option("Dynamic Drive","http://www.blueb.co.kr/");
secondGroup[1][2][2]=new Option("Beginner\'s Guide to DHTML","http://www.blueb.co.kr/");
secondGroup[1][2][3]=new Option("Web Coder","http://www.blueb.co.kr/");
secondGroup[1][3][0]=new Option("Now Select This One"," ");
secondGroup[1][3][1]=new Option("CGI Resources","http://www.blueb.co.kr/");
secondGroup[1][3][2]=new Option("Ada\'s Intro to CGI","http://www.blueb.co.kr/");
secondGroup[1][3][1]=new Option("CGI Resources","http://www.blueb.co.kr/");
secondGroup[1][3][2]=new Option("Ada\'s Intro to CGI","http://www.blueb.co.kr/");
secondGroup[2][0][0]=new Option("---Select 3---"," ");
secondGroup[2][1][0]=new Option("Now Select This One"," ");
secondGroup[2][1][1]=new Option("CNN","http://www.blueb.co.kr/");
secondGroup[2][1][2]=new Option("MSNBC","http://www.blueb.co.kr/");
secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");
secondGroup[2][1][0]=new Option("Now Select This One"," ");
secondGroup[2][1][1]=new Option("CNN","http://www.blueb.co.kr/");
secondGroup[2][1][2]=new Option("MSNBC","http://www.blueb.co.kr/");
secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");
secondGroup[2][2][0]=new Option("Now Select A Page"," ");
secondGroup[2][2][1]=new Option("News.com","http://www.blueb.co.kr/");
secondGroup[2][2][2]=new Option("Wired","http://www.blueb.co.kr/");
secondGroup[2][2][1]=new Option("News.com","http://www.blueb.co.kr/");
secondGroup[2][2][2]=new Option("Wired","http://www.blueb.co.kr/");
var temp1=document.isc.stage3
function redirect1(y){
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
function redirect2(z){
window.location=temp1[z].value
}
window.location=temp1[z].value
}
//-->
</script>
</script>
</td>
</tr>
</table>
</FORM>
</tr>
</table>
</FORM>
http://creamnite.com/verse1.3/bbs/board.php?bo_table=board0302&wr_id=93
저는 한단계가 더 필요해서요...
아는게 워낙 없어서 위에 코드만 보고 이렇게 저렇게 하는데도 잘안되서 도움부탁드립니다.
댓글 3
-
서방서방
2015.07.21 10:12
-
미사일발사
2015.07.21 11:19
답변감사합니다.
세번째를 네번째로 변경하시고첫번째 두번째를 참고 하셔서 세번째를 추가적 만드시면 됩니다~이게 무슨말씀이신지...
죄송하지만 조금만더 세부적으로 알려주실순 없나요 ㅠㅠ..
답변중 세번째라는 글위에 두번째라는 단락을 추가하고 i,j등을 수정 k를 추가...? temp2도 추가...? redirect3도 추가...?
등등 해보고있는 중이지만 결과가 안나와서요...
-
서방서방
2015.07.31 12:58
//두번째 selectbox 에 들어갈 option 데이터 설정 Start
var groups=document.isc.example.options.length
var group=new Array(groups)for (i=0; i<groups; i++)
group[i]=new Array()group[0][0]=new Option("---Select2---"," ");group[1][0]=new Option("서브 1-1-1"," ");
group[1][1]=new Option("서브 1-1-2","47");
group[1][2]=new Option("서브 1-1-3","46");
group[1][3]=new Option("서브 1-1-4","45");group[2][0]=new Option("서브 1-2-1"," ");
group[2][1]=new Option("서브 1-2-2","115");
group[2][2]=new Option("서브 1-2-3","116");var temp=document.isc.stage2 //두번째 selectbox 객체
function redirect(x){ //첫번째 selectbox 선택시 상위에 group 데이터 바인딩(첫번째 selectbox 선택 값에 따라 두번째 selectbox 데이터가 틀려짐)
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}두번째//세번째 selectbox 에 들어갈 option 데이터 설정 Startvar secondGroups=document.isc.stage2.options.length
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}secondGroup[0][0][0]=new Option("---Select 3---"," ");
secondGroup[1][0][0]=new Option("---Select 3---"," ");
secondGroup[1][1][0]=new Option("Now Select This One"," ");
secondGroup[1][1][1]=new Option("Website Abstraction","http://www.blueb.co.kr/");
secondGroup[1][1][2]=new Option("Javascript for the non programmer","http://www.blueb.co.kr/");
secondGroup[1][1][3]=new Option("Java-scripts.net","http://www.blueb.co.kr/");secondGroup[1][2][0]=new Option("Now Select This One"," ");
secondGroup[1][2][1]=new Option("Dynamic Drive","http://www.blueb.co.kr/");
secondGroup[1][2][2]=new Option("Beginner\'s Guide to DHTML","http://www.blueb.co.kr/");
secondGroup[1][2][3]=new Option("Web Coder","http://www.blueb.co.kr/");secondGroup[1][3][0]=new Option("Now Select This One"," ");
secondGroup[1][3][1]=new Option("CGI Resources","http://www.blueb.co.kr/");
secondGroup[1][3][2]=new Option("Ada\'s Intro to CGI","http://www.blueb.co.kr/");secondGroup[2][0][0]=new Option("---Select 3---"," ");
secondGroup[2][1][0]=new Option("Now Select This One"," ");
secondGroup[2][1][1]=new Option("CNN","http://www.blueb.co.kr/");
secondGroup[2][1][2]=new Option("MSNBC","http://www.blueb.co.kr/");
secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");secondGroup[2][2][0]=new Option("Now Select A Page"," ");
secondGroup[2][2][1]=new Option("News.com","http://www.blueb.co.kr/");
secondGroup[2][2][2]=new Option("Wired","http://www.blueb.co.kr/");var temp1=document.isc.stage3 //세번째 selectbox 객체function redirect1(y){ //두번째 selectbox 선택시 상위에 secondgroup 데이터 바인딩(첫번째 selectbox값과 두번째 selectbox값에 따라 세번째 selextbox 데이터가 틀려짐)
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}thordgroup 을 만드시고 배열을 늘리시고 위소스 참고 하셔서 하시면 됩니다.직접 코드로 짜드리기에는 머랄까.. 소스에 대한 이해 없이 만드시는건 ..
첫번째
var groups=document.isc.example.options.length
var group=new Array(groups)
group[i]=new Array()
group[1][1]=new Option("서브 1-1-2","47");
group[1][2]=new Option("서브 1-1-3","46");
group[1][3]=new Option("서브 1-1-4","45");
group[2][1]=new Option("서브 1-2-2","115");
group[2][2]=new Option("서브 1-2-3","116");
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
secondGroup[1][0][0]=new Option("---Select 3---"," ");
secondGroup[1][1][0]=new Option("Now Select This One"," ");
secondGroup[1][1][1]=new Option("Website Abstraction","http://www.blueb.co.kr/");
secondGroup[1][1][2]=new Option("Javascript for the non programmer","http://www.blueb.co.kr/");
secondGroup[1][1][3]=new Option("Java-scripts.net","http://www.blueb.co.kr/");
secondGroup[1][2][1]=new Option("Dynamic Drive","http://www.blueb.co.kr/");
secondGroup[1][2][2]=new Option("Beginner\'s Guide to DHTML","http://www.blueb.co.kr/");
secondGroup[1][2][3]=new Option("Web Coder","http://www.blueb.co.kr/");
secondGroup[1][3][1]=new Option("CGI Resources","http://www.blueb.co.kr/");
secondGroup[1][3][2]=new Option("Ada\'s Intro to CGI","http://www.blueb.co.kr/");
secondGroup[2][1][0]=new Option("Now Select This One"," ");
secondGroup[2][1][1]=new Option("CNN","http://www.blueb.co.kr/");
secondGroup[2][1][2]=new Option("MSNBC","http://www.blueb.co.kr/");
secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");
secondGroup[2][2][1]=new Option("News.com","http://www.blueb.co.kr/");
secondGroup[2][2][2]=new Option("Wired","http://www.blueb.co.kr/");
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
window.location=temp1[z].value
}