How to bind a list of selected elements to a ViewModel

Question

I want to bind a list of selected elements from the UI to my ViewModel. Here is the HTML:

@Html.Label("Actors")
  <select name="actors" class="chosen-select" multiple="" 
          data-placeholder="Select actors of the Screen">
      @for(int i = 0; i < actors.Count; i ++)
      {
          <option value="@i">@actors[i].name</option>
      }
  </select

Btw, I am using chosen.js, so after this point, in the user interface I'll get the entire list of actors. The client must select one or more than one.

How do I put all of the selected items into a List and send the result to the server?

Answer 1

I saw the demo of chosen.js plugin, it is create a new DIV element instead of SELECT element, so it can't sync selected status back to the SELECT element.

but u can create a CHANGE event to watch selected status. ref. http://harvesthq.github.io/chosen/#change-update-events

eg when a option selected, put value to a hidden text use commas to separate, and at the server side to process.