How to select Muntliple input to remove from the list

[Pervez Mulla]

Hi,

I have the code , which add the data from input filed to list-box.Now am able to remove individual input's.

I want to have option multiple select to remove the data from list box .
<form id="frm" action="" method="post">
Select list:<br/>
<select name="sel_list" id="sel_list" size="2" onchange="adOption.selOpt(this.value, 'optval')"></select><br/><br/>
Add an option: <input type="text" name="optval" id="optval" /><br /><br/>
<input type="button" id="addopt" name="addopt" value="Add Option" onclick="adOption.addOption('sel_list', 'optval');" /> &nbsp;
<input type="button" id="del_opt" name="del_opt" value="Delete Option" onclick="adOption.delOption('sel_list', 'optval');" />
</form>
<script type="text/javascript"><!--
var adOption = new Object();
adOption.checkList = function(list, optval) {
var re = 0;
var opts = document.getElementById(list).getElementsByTagName('option');

for(var i=0; i<opts.length; i++) {
if(opts[i].value == document.getElementById(optval).value) {
re = 1;
break;
}
}
return re;
};
adOption.addOption = function(list, optval) {
var opt_val = document.getElementById(optval).value;
if(opt_val.length > 0) {
if(this.checkList(list, optval) == 0) {
var myoption = document.createElement('option');
myoption.value = opt_val;
myoption.innerHTML = opt_val;
document.getElementById(list).insertBefore(myoption, document.getElementById(list).firstChild);

document.getElementById(optval).value = '';
}
else alert('The value "'+opt_val+'" already added');
}
else alert('Add a value for option');
};
adOption.delOption = function(list, optval) {
var opt_val = document.getElementById(optval).value;
if(this.checkList(list, optval) == 1) {
var opts = document.getElementById(list).getElementsByTagName('option');
for(var i=0; i<opts.length; i++) {
if(opts[i].value == opt_val) {
document.getElementById(list).removeChild(opts[i]);
break;
}
}
}
else alert('The value "'+opt_val+'" not exist');
}
adOption.selOpt = function(opt, txtbox) { document.getElementById(txtbox).value = opt; }
--></script>

How can I do this ....?
Please Help

Thank You
Pervez

[dann...@gmail.com]

check -> http://www.webdevout.net/test?01b&raw

new Option() is js, simpler, native. Yes you can use DOM too, either way.
Don't forget to set 'multiple' for your Select element, also give a 'hint' to users, like with say title="Use Ctrl-click to select several', or so, so they know.
The only thing to heed I gather on the multiple deletion is, as I commented it in the source, to delete backwards, each time a child gets poped out above the others[that is smaller index option], the ones below INDEX ORDER changes and so does .length and that affects negatively the FOR loop. Looping backwards, delete below ones first, no bumping anyone's index.

Danny