MVC Kendo Grid with custom popup editor using MultiSelect - can't get selected items in model
<p>The title says it all.</p>

<p>POPUP FORM:</p>

<pre><code>@using Kendo.Mvc.UI
@using Batc.AgileApp.Web.Areas.ProductReuse.Models
@model BomViewModel

@Html.HiddenFor(m =&gt; m.BomId)
@Html.HiddenFor(m =&gt; m.Row)
@Html.HiddenFor(m =&gt; m.UserWorkSessionId)


&lt;div class="container-fluid"&gt;
    &lt;div class="form-group row"&gt;
        &lt;div class="col-xs-4 col-sm-4"&gt;
            &lt;span&gt;
                @Html.LabelFor(model =&gt; model.ProductClass)
            &lt;/span&gt;
            &lt;br/&gt;@(Html.Kendo().DropDownListFor(m =&gt; m.ProductClass)
                       .DataTextField("Text")
                       .DataValueField("Value")
                       .HtmlAttributes(new {style = "width:125px"})
                       .DataSource(source =&gt;
                       {
                           source.Read(read =&gt; { read.Action("GetDropDownLookups", "AjaxProductReuse", new {id = "ProductClass"}); });
                       })
                       )
            &lt;div style="font-weight: normal;"&gt;
                @Html.ValidationMessageFor(model =&gt; model.ProductClass)
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="col-xs-4 col-sm-4"&gt;
            &lt;span&gt;
                @Html.LabelFor(model =&gt; model.ProgramSelectedList)
            &lt;/span&gt;

            @(Html.Kendo().MultiSelectFor(m =&gt; m.ProgramSelectedList)
                  .Placeholder("Select program...")
                  .HtmlAttributes(new {style = "width:200px"})
                  .DataSource(source =&gt;
                  {
                      source.Read(read =&gt; { read.Action("GetLookups", "AjaxProductReuse", new {id = "Program"}); });
                  })
                  )
            &lt;div style="font-weight: normal;"&gt;
                @Html.ValidationMessageFor(model =&gt; model.ProgramSelectedList)
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>GRID FORM (cshtml view):</p>

<pre><code>@using Batc.AgileApp.Web.Areas.ProductReuse.Models
@using Kendo.Mvc.UI
@model AssemblyViewModel


@using (Html.BeginForm("Assembly", "ProductReuse", FormMethod.Post, new {id = "frmStartScreen"}))
{
    @Html.HiddenFor(m =&gt; m.Status)
    @Html.HiddenFor(m =&gt; m.UserWorkSessionId)
    @Html.HiddenFor(m =&gt; m.GlobalPartNum)

    @(Html.Kendo().Grid&lt;BomViewModel&gt;()
          .Name("bom-prGrid-kendoGrid")
          .HtmlAttributes(new {@class = "prGrid"})
          .ClientRowTemplate("")
          .Columns(columns =&gt;
          {
              columns.Command(cmd =&gt; cmd.Edit()).Width(80);
              columns.Bound(g =&gt; g.BomId).Hidden();
              columns.Bound(g =&gt; g.IsEditable).Hidden();
              columns.Bound(g =&gt; g.Row).Width(75).Title("Row");
              columns.Bound(p =&gt; p.Program).Width(100).Title("Program");
              columns.Bound(p =&gt; p.ProductClass).Width(100).Title("Product&lt;br/&gt;Class");
              columns.Bound(p =&gt; p.ResponsibleEng).Width(120).Title("Resp Eng");
              columns.Bound(p =&gt; p.ProjectNum).Width(100).Title("Project&lt;br/&gt;No");
              columns.Bound(p =&gt; p.AccessControl).Width(150).Title("Access Control");
          })
          .DataSource(dataSource =&gt; dataSource
              .Ajax()
              .Model(model =&gt; { model.Id(g =&gt; g.BomId); })
              .PageSize(100)
              .Read(r =&gt; r.Action("GetCloneAssembly", "AjaxProductReuse").Data("ProductReuseGridReadData"))
              .Update(u =&gt; u.Action("UpdateBomItem", "AjaxProductReuse").Type(HttpVerbs.Post))
              .Events(e =&gt; e.Error("ajax_error").Sync("dataSource_sync").Change("dataSource_change"))
          )
          .Events(e =&gt; e.DataBound("onDataBound").Edit("onEdit"))
          .Pageable(pager =&gt; pager
              .Input(true)
              .Numeric(true)
              .Info(true)
              .PreviousNext(true)
              .Refresh(true)
              .PageSizes(new int[] {100, 250, 500, 1000})
          )
          .Sortable()
          .Scrollable()
          .Filterable()
          .Editable(editable =&gt; editable.Mode(GridEditMode.PopUp).TemplateName("BOMForm").Window(w =&gt; w.Title("Manage BOM Item").Name("BOMForm"))) 
          .Resizable(resizing =&gt; resizing.Columns(true)).Reorderable(reorder =&gt; reorder.Columns(true))
          )
}
</code></pre>

<p>Model (properties of interest):</p>

<pre><code>[MetadataType(typeof(BomViewModelMetaData))]
public class BomViewModel: BomModel
{
    public int BomId { get; set; }
    public int Row { get; set; }
    public int UserWorkSessionId { get; set; }
    public string ProductClass { get; set; }
    public string Program { get; set; }
    public List&lt;string&gt; ProgramSelectedList { get { return Program.ToList(); } set { Program = value.ToDelimitedString(); } }

}
</code></pre>

<p>My (ajax) controller looks like:</p>

<pre><code>public JsonResult UpdateBomItem([DataSourceRequest] DataSourceRequest request, BomViewModel bomViewModel)   // [Bind(Prefix = "models")]
{
    var command = _mapper.Map&lt;BomModel&gt;(bomViewModel);
    var commandResponse = _productReuseService.UpdateBomItem(command);
    var response = _mapper.Map&lt;List&lt;BomViewModel&gt;&gt;(commandResponse);
    return Json(ToDataSourceResult(response, request, modelState: ModelState));
}
</code></pre>

<p>The problem I am encountering is the data being posted to my controller.  It looks like this in fiddler (where the first 3 items map to the first object in the controller, the remainder being the model):</p>

<pre><code>sort=
&amp;group=
&amp;filter=
&amp;Program=PROGRAM_ORIGINAL
&amp;ProgramSelectedList[0]=PROGRAM_01
&amp;ProgramSelectedList[1]=PROGRAM_02
&amp;UserWorkSessionId=45
&amp;Row=10
&amp;ProductClass=1
&amp;BomId=151927
</code></pre>

<p>What I expected was:</p>

<pre><code>sort=
&amp;group=
&amp;filter=
&amp;Program=PROGRAM_01, PROGRAM_02
&amp;ProgramSelectedList=PROGRAM_01
&amp;ProgramSelectedList=PROGRAM_02
&amp;UserWorkSessionId=45
&amp;Row=10
&amp;ProductClass=1
&amp;BomId=151927
</code></pre>

<p>Is there a "special" setting in Kendo or JQuery or .NET to make this list behave correctly?  I currently am using Kendo in MVC HTML Helper mode only.  This means I have almost no JS propping up my desired actions on the UI side of things.  </p>

<p>This is an internal LOB app, low usage, minimal users.</p>