Get List of Multiple Selected Options in Select Box

Question

I am doing a function where i am displaying a multile select box, it shows the items in the select box and some comes up as already selected, What i am trying to do is;

select the items by dragging a mouse to select all, using a click on the item or there are all ways by which which we can select the items within the select box, be it mouse or keyboard., I am trying to show/hide contents based upon one of the selection of select box which is MD . On Page, i am trying that if MD is selected, it should keep the div opened.

here is my try but i am failing in this because my knowledge in javascript is very less, if someone can point me in right direction, that will be great

Here is my try:

<select id="assignType" onChange="checkASelection()" size="5" name="assignType" class="inputMultiLong" multiple>        
                                <option value="M">List 1</option>
                                <option value="MS">List 2</option>
                                <option value="MD">List 3</option>
                            </select>   

<div class="tabRow" id="annsection" style="display:none;">
my code here 
</div>

Javascript Code:

function checkASelection() {
        var thisVal = document.getElementById('assignType').value;
        alert(thisVal);
        if(thisVal == 'MD') {
            document.getElementById('annsection').style.display='block';
        }
    }

Want to in javascript but jquery is also an option which i am check

Answer 1

Not sure what you trying to archieve, but i guess you want to get all the selected options, do you?

If so, you could do something like this in JQuery:

$('select#assignType').val();

This will return you all the selcted options

Here is a fiddle: http://jsfiddle.net/gya6mwmb/3/

Answer 2

You could use jquery inArray method:

$(function(){
$("#assignType").click(function(){
    var indice = $.inArray("MD",$(this).val()) ;   
    if(indice == -1){
        $("#annsection").hide();
    }
    else{
         $("#annsection").show();
    }
});
});

Working fiddle: http://jsfiddle.net/robertrozas/voknxtL0/3/