Ctrl Click with SELECT MULTIPLE

rweide · October 4th, 2004, 03:42 PM

Hi, All,

I have a list box, which when user makes selection, I will check the selected value and display something on screen.
My question: How do I detect which value has been selected when user use Ctrl-Click to select multiples?

Thanks.

ChrisScott · October 5th, 2004, 03:14 AM

Hi,

One way is to use the onchange event to handle a change in selection, then check the selected property of each of each option in the select box.

Code:

<select name="mySelect" id="mySelect" multiple="multiple" onchange="ShowSelected(this);">
...some options...
</select>

...

function ShowSelected(pBox){
    var temp = "";
    for(var i = 0; i < pBox.options.length; i++){
        if(pBox.options[i].selected){
            temp += pBox.options[i].text + "\n";
        }
    } 
    alert("You selected: \n" + temp);
}

HTH,

Chris

rweide · October 5th, 2004, 07:01 AM

Thanks, but what about I want to catch the very one that user just selected? Instead of going thru the entire loop, especially when user uses [u]Ctrl-Click </u>to select multiple? I mean, I know the first they click, but what about the subsequent onces with Ctrl-Click?

ChrisScott · October 5th, 2004, 07:51 AM

Hey,

The following works for me, using an array to store the state after each selection (AFAIK there is no single property you can use)...

Code:

var gSelected = [];
function ShowSelected(pBox){
    var temp = "";
    for(var i = 0; i < pBox.options.length; i++){
        if(pBox.options[i].selected != gSelected[i]){
            gSelected[i] = pBox.options[i].selected;

            if(gSelected[i]){
                alert("you selected " + pBox.options[i].text);
            }
        }
    } 
}

Cheers,

Chris

rweide · October 5th, 2004, 12:14 PM

Thanks, this helps!