Getting selected items count ListBox with jQuery

Question

As in topic - how to get selected items count in ListBox with jQuery, while user is selecting new item?

I have these code:

@Html.ListBoxFor(x => Model.StatesID, Model.States,
        new { @class = "chzn-select", @id="StatesID", data_placeholder = "Choose...", style = "width:350px;" })


function countStates() {
    var count = $("#StatesID:selected").length;
    alert(count);

}

I can get count of selected items in onclick input action, but how to connect this js function with onclick event, or maybe other event, when user is selecting new item in my listbox?

Answer 1

Adding my comment as answer....

If it is a multi-select, you will want to use....

$('#StatesID').on('change', function(){
    countStates();
});

otherwise click does not fire if the user selects more that one option at a time.

Answer 2

Try this :

$(document).ready(function() {
    $('#StatesID').click(countStates);
});