Add values to MultiSelect from Grid select

[Shehab]

Hi,
I have a multiselect that works very well:

@(Html.Kendo().MultiSelectFor(model => model.SurgeryMultiSelect).Filter("contains")
    .Name("SurgeryMultiSelect")
    .DataTextField("Description")
    .DataValueField("ProcedureTypeId")
    .Placeholder("Select Procedure(s)...")
    .DataSource(source =>
      {
          source.Read(read =>
          {
              read.Action("GetAllProcedures", "CommonJsonActions");
          });
      })
    .Events(e =>
        {
            e.Change("fnSurgeryListChange");
        })
)

I also have a grid with a select option that will call a js function; in this function I want to add the selected value from the grid to the select items in the multiselect, if it doesn't already exist. Then call the change event in the multiselect if anything new is added.

Any help will be appreciated.
Thanks,
Shehab

[Daniel]

Hello Shehab,

You can use the value method to set the currently selected values e.g.

function addItemToSelection(item) {
    var multiselect = $("#SurgeryMultiSelect").data("kendoMultiSelect");
    var value = multiselect.value();
    if (value.indexOf(item.ProcedureTypeId) == -1) {
        //in case the multiselect dataSource is currently filtered
        multiselect.dataSource.filter([]);

        value = value.slice(0);
        value.push(item.ProcedureTypeId);
        multiselect.value(value);

        multiselect.trigger("change");
    }
}

Regards,
Daniel
Telerik