PDA

View Full Version : problem in select list move options



giselle2008
01-14-2008, 09:00 AM
<script language="JavaScript" type="text/javascript">

function deleteOption(theSel, theIndex)
{
var selLength = theSel.length;
if(selLength>0)
{
theSel.options[theIndex] = null;
}
}
function moveOptions(theSelFrom, theSelTo)
{
var theSelFrom=document.getElementById(theSelFrom);
var theSelTo=document.getElementById(theSelTo);
var selLength = theSelFrom.length;
var selToLength =theSelTo.length;
var i;
// var counter =0;

for(i=selLength-1; i>=0; i--)
{
if((theSelFrom.options[i].selected))
{

msg=theSelFrom.options[i].text;
msgvalue=theSelFrom.options[i].value;
theSelTo.options[selToLength]=new Option(msg,msgvalue);
selToLength=theSelTo.options.length;
//counter =counter + 1;
deleteOption(theSelFrom, i);
placeInHidden('.', 'sel2', 'hidY');
}
}
}
function placeInHidden(delim, selStr, hidStr)
{
var selObj = document.getElementById(selStr);
var hideObj = document.getElementById(hidStr); //hidden text box
hideObj.value = '';
for (var i=0; i<selObj.options.length; i++)
{
hideObj.value = hideObj.value =='' ? selObj.options[i].value : hideObj.value + delim + selObj.options[i].value;
}
}
</script>
</head>
<body>
<form action="test3.asp" method="post" name="frm">
<table border="0">
<tr>
<td> Categories Available</td>
<td>&nbsp;</td>
<td> Selected Categories</td>
</tr>
<tr>
<td>
<select name="sel1" id ="sel1" size="10" multiple="multiple">
<option value='1'>One</option>
<option value='2'>Two</option>
<option value='3'>Three</option>
<option value='4'>Four</option>
<option value='5'>Five</option>
<option value='6'>Six</option>
<option value='7'>Seven</option>
<option value='8'>Eight</option>
</select>
</td>
<td align="center" valign="middle" size="10">
<input type="button" value="&gt;&gt;" onclick="moveOptions('sel1','sel2');" /><br />
<input type="button" value="&lt;&lt;" onclick="moveOptions('sel2', 'sel1');" />
</td>
<td>
<select name="sel2" id="sel2" size="10" multiple="multiple">
</select>
</td>
</tr>
</table>

<input type="text" name="hidY" value="" />
<input type="submit" name="btnSubmit" value="Submit"/>
</form>


</body>
</html>


halo..i need some help on this coding. i would like to do a Select list move options, i can do the select multiple opetion from a list. but now i need to block the user to choose more than 5 records from the list. if user choose more than 5, it will block it, and return back to the orignal..can some help plz help me on this coding?urgent, plz help. thanx you .

pman
01-15-2008, 12:44 AM
You need to create another function add it to the onchange event for the select tag. Then you can loop through the total selection and see if it exceeds max. number of selection. Here's an example that you can look at.

http://www.faqts.com/knowledge_base/view.phtml/aid/14441