메뉴 건너뛰기


Developer > Web Application





 선택된 값을 다른쪽 Select 박스로 옮기기 
select 박스에서 하나 혹은 여러개를 선택해서 다른쪽 Select 박스로 옮기는 소스입니다.
관리 툴 같은거 만들때 사용하기 좋겠죠?
멀티로 선택해서 옮기기도 가능합니다. 

 샘플화면보기



 소스코드보기

<script> function senditem() { var F=document.slctfm; var selidx=F.from.selectedIndex; var i=0; if(selidx==-1) return; for(i=selidx; i<f.from.length; i++){ if(F.from.options[i].selected==false) break; var tx=F.from.options[i].text; var va=F.from.options[i].value; F.to.options[F.to.length]=new Option(tx,va); } for(i--; i>=0; i--){ if(F.from.options[i].selected==false) break; F.from.options[i]=null; } if(selidx<f.from.length) F.from.selectedIndex=selidx; else if(selidx>=F.from.length) F.from.selectedIndex=selidx-1; } function reciveitem() { var F=document.slctfm; var selidx=F.to.selectedIndex; var i=0; if(selidx==-1) return; for(i=selidx; i<f.to.length; i++){ if(F.to.options[i].selected==false) break; var tx=F.to.options[i].text; var va=F.to.options[i].value; F.from.options[F.from.length]=new Option(tx,va); } for(i--; i>=0; i--){ if(F.to.options[i].selected==false) break; F.to.options[i]=null; } if(selidx<f.to.length) F.to.selectedIndex=selidx; else if(selidx>=F.to.length) F.to.selectedIndex=selidx-1; } </script> <form name="slctfm" method=get> <table> <tr><td> <select name="from" size="10" style="width:275px" multiple> <option value="1">C/C++ <option value="2">JAVA <option value="3">HTML <option value="4">CSS <option value="5">STYLE <option value="6">JAVAscRIPT <option value="7">PHP <option value="8">PERL <option value="9">XML <option value="10">C# </select> </td> <td> <input type="button" name="send" value="-&gt;" onclick="senditem()" /><br /> <input type="button" name="recive" value="&lt;-" onclick="reciveitem()" /> </td> <td> <select name="to" size="10" style="width:275px" multiple> </select> </td> </table> </form>


Creative Commons License
Creative Commons License이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
Copyright 조희창(Nicholas Jo). Some rights reserved. http://bbs.nicklib.com