셀렉트 박스 추가/수정/삭제 순서이동 - MSN미니홈피 기능상 비슷
작성일 07-08-08 10:13
페이지 정보
작성자서방님 조회 76회 댓글 0건본문
요즘 미니홈피 컨텐츠를 만들면서 싸이와 MSN 홈피를 많이 보구 있습니다.
개인적으론 MSN 미니홈피가 맘에 들더군요 관리 기능부터 전체적으로
머랄까 짜임새있는 느낌이랄까요
암튼 이번 미니홈피를 하면서 MSN 미니홈피의 게시판 관리메뉴가 맘에 들어
따라해봤습니다. 번거롭게 느껴지는 alert() 는 참고상으로 넣어봤습니다
여기소스는 기존에 올라와있던 동적다중셀렉트박스 를 참고하였고
addValue 함수와 editValue 함수를 추가했습니다.
필요하신분 퍼가세요~~
------------------------------------------------------------------------------
<html>
<head>
<TITLE>MSN 미니홈피 따라하기 - 게시판 폴더 추가수정삭제이동 셀렉트박스</TITLE>
<meta http-equiv=Content-Type content=text/html; charset=EUC-KR>
</head>
<body>
<script language=javascript>
function gol(argSel,argRes)
{
formSel=eval("document.reg."+argSel);
if (formSel.value)
{
if (confirm("선택한 게시판을 삭제할 경우 해당게시물들은 모두 삭제됩니다."))
{
buff=new Array();
j=0;
for(var i=formSel.length-1;i>=0;i--)
{
if(formSel.options[i].selected && formSel.options[i].value)
{
formSel.options[i] = null;
}
}
get_result(argSel,argRes);
}
}
else
{
alert("삭제할 게시판을 선택하세요.");
formSel.focus();
return;
}
}
function get_result(argSel,argRes)
{
formSel=eval("document.reg."+argSel);
formRes=eval("document.reg."+argRes);
res=new Array();
for(var i=0;i<formSel.length;i++)
{
res[i]=formSel.options[i].value;
}
res=res.join("@");
formRes.value=res;
}
function gou(argSel,argRes)
{
formSel = eval("document.reg."+argSel);
if(!formSel.value)
{
return;
}
thisIndex = formSel.selectedIndex;
if(!thisIndex)
{
return;
}
formSel.value=null;
prevIndex=thisIndex-1;
tempText=formSel.options[prevIndex].text;
tempValue=formSel.options[prevIndex].value;
formSel.options[prevIndex] = new Option(formSel.options[thisIndex].text,formSel.options[thisIndex].value);
formSel.options[thisIndex] = new Option(tempText,tempValue);
formSel.value=formSel.options[prevIndex].value;
get_result(argSel,argRes);
}
function god(argSel,argRes)
{
formSel = eval("document.reg."+argSel);
if(!formSel.value)
{
return;
}
thisIndex = formSel.selectedIndex;
if(thisIndex+1>=formSel.length)
{
return;
}
formSel.value=null;
prevIndex=thisIndex+1;
tempText=formSel.options[prevIndex].text;
tempValue=formSel.options[prevIndex].value;
formSel.options[prevIndex] = new Option(formSel.options[thisIndex].text,formSel.options[thisIndex].value);
formSel.options[thisIndex] = new Option(tempText,tempValue);
formSel.value=formSel.options[prevIndex].value;
get_result(argSel,argRes);
}
function addValue(argSel,argRes,argAdd)
{
formSel=eval("document.reg."+argSel);
addSel =eval("document.reg."+argAdd);
if (addSel.value)
{
j=formSel.length;
if(j < 8)
{
formSel.options[j]=new Option(addSel.value,j);
addSel.value="";
}
else
{
alert("더이상 게시판을 만들수 없습니다.");
return;
}
get_result(argSel,argRes)
}
else
{
alert("추가할 게시판을 입력하세요.");
addSel.focus();
return;
}
}
function editValue(argSel,argRes,argAdd)
{
formSel=eval("document.reg."+argSel);
addSel =eval("document.reg."+argAdd);
if (formSel.value)
{
if (addSel.value)
{
thisIndex = formSel.selectedIndex;
if(thisIndex <= formSel.length)
{
formSel.options[thisIndex]=new Option(addSel.value,thisIndex);
addSel.value="";
get_result(argSel,argRes)
}
else
{
return;
}
}
else
{
alert("수정될 게시판이름을 입력하세요.");
addSel.focus();
return;
}
}
else
{
alert("수정할 게시판을 선택하세요.");
formSel.focus();
return;
}
}
</script>
<form name="reg">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>셀렉트</td>
<td>
<select name="b1" size="10" style="width:200">
</select>
</td>
<td align="center">
<input class="button" name="button" onclick="gou('b1','res1')" type="button" value=" ↑ ">
<br>
<input class="button" name="button" onclick="god('b1','res1')" type="button" value=" ↓ "></td>
</tr>
<tr>
<td align="center" height="23"> </td>
<td><input class="button" name="button22" onclick="addValue('b1','res1','add')" type="button" value="추가">
<input class="button" name="button222" onclick="editValue('b1','res1','add')" type="button" value="수정">
<input class="button" name="button2" onclick="gol('b1','res1')" type="button" value="삭제"></td>
<td> </td>
</tr>
<tr>
<td align="center" height="23">입력</td>
<td><input name="add" type="text"></td>
<td>
</td>
</tr>
<tr>
<td align="center">결과</td>
<td><input name="res1" type="text"></td>
<td> </td>
</tr>
</table>
<br>
<br>
</form>
</body>
</html>
댓글목록
등록된 댓글이 없습니다.