Friday, April 18, 2014

How to assign on select option to other select option using javascript doubleclick event example

See the below code example : 

<select name="function_id[]" id="function_id" size="5" multiple="multiple" style="width: 240px" ondblclick="delFunc()">
 </select>


<select name="avail_func" id="avail_func" size="5" style="width: 240px" ondblclick="addFunc()"><option value="64">test</option>

<option value="65">test1</option></select>
<script>

function delFunc() {
                var elm = document.getElementById('function_id');
                while (elm.selectedIndex > -1) elm.options.remove(elm.selectedIndex);
                }
 function addFunc() {
                var elm1 = document.getElementById('avail_func');
                var elm2 = document.getElementById('function_id');

                if (elm1.selectedIndex > -1) {
                                var new_id = elm1.options[elm1.selectedIndex].value;
                                var new_name = elm1.options[elm1.selectedIndex].text;
                                var alreadythere = false;

                                for (i=0; i<elm2.options.length; i++)
                                                if (elm2.options[i].value == new_id) alreadythere = true;

                                if (! alreadythere) elm2.add(new Option(new_name, new_id));
                }
                }


</script>

Double click to assign your select value:

No comments:

Post a Comment