title: Data binding in Kendo grid popup window with MultiSelect widget
body: <p>I have a grid which uses custom template for editing inside popup window.</p>
  
  <pre><code>                .Editable(editable =&gt; editable.Mode(GridEditMode.PopUp)
                      .TemplateName("EditForm")
                      .Window(wnd =&gt; wnd.Title("New form")
                         .Name("EditFormWindow")
                      .Draggable(true)
                      .Modal(true)
  </code></pre>
  
  <p>The template contains several Kendo dropdowns, which are cascaded from each other.</p>
  
  <pre><code>&lt;div class="editor-field"&gt;
      @(Html.Kendo().DropDownList()
            .Name("FormGroupId")
            .HtmlAttributes(new { style = "width:250px" })
            .OptionLabel("Select form group...")
            .DataTextField("Name")
            .DataValueField("Id")
            .DataSource(source =&gt; source.Read(read =&gt; read.Route(RouteConfig.GetFormGroupNames.Name)).ServerFiltering(true))
                            .Events(events =&gt;
                                {
                                    events.Cascade("onFormGroupChange");
                                    events.Change("onFormGroupChange");
                                })
            )
  &lt;/div&gt;
  
  &lt;div class="editor-field"&gt;
      @(Html.Kendo().DropDownList()
            .Name("Schema")
            .HtmlAttributes(new { style = "width:250px" })
            .OptionLabel("Select schema...")
            .DataTextField("SchemaName")
            .DataValueField("SchemaName")
            .DataSource(source =&gt; source.Read(read =&gt; read.Route(RouteConfig.FilterFormSchemas.Name).Data("filterSchemas")).ServerFiltering(true))
            .Enable(false)
            .AutoBind(false)
            .CascadeFrom("FormGroupId")
            )
  &lt;/div&gt;
  </code></pre>
  
  <p>And they work fine, but right now I need to add MultiSelect widget to this template, which doesn't support cascading out of the box.</p>
  
  <p>So I added such code:</p>
  
  <pre><code>&lt;input id="Sectors" name="Sectors" disabled="disabled" /&gt;
  
      var sectors;
      var formGroupParametersDataSource;
  
      var sectorsDataSource = new kendo.data.DataSource({
          data: []
      });
  
      $(document).ready(function() {
  
          formGroupParametersDataSource = new kendo.data.DataSource({
              type: "aspnetmvc-ajax",
              serverFiltering: true,
              transport: {
                  read: "@Url.RouteUrl(RouteConfig.GetFormGroupParameters.Name)"
              },
              change: function() {
                  var data = this.data()[0].Sectors.toJSON();
                  sectorsDataSource.data(data);
              }
          });
  
          sectors = $("#Sectors").kendoMultiSelect({
              autoBind: false,
              dataTextField: "Key",
              dataValueField: "Value",
              optionLabel: "Select form sectors...",
              dataSource: sectorsDataSource,
          }).data("kendoMultiSelect");
  
      });
  
      function onFormGroupChange(e) {        
          var value = this.value();
          if (value) {
              formGroupParametersDataSource.one("change", function () {
                  sectors.current(null);
              }).filter({
                  field: "Id",
                  operator: "eq",
                  value: value
              });
  
              sectors.enable();
              sectors.refresh();
          } else {
              sectors.enable(false);
          }
      }  
  </code></pre>
  
  <p>As you can see, I am filtering the datasource each time I changed FormGroupId dropdown setting the data of Sectors property inside the view model to the newly created sectorsDataSource.</p>
  
  <p>That works fine for new row in the grid. The problem comes when I try to edit the row, then even if the Sectors property in the viewmodel has values they are not bound to the multiselect widget.</p>
  
  <p>Any suggestions or help?</p>