Issues with Grid Multiselect Editor Function using knockout bindings

[Chudi]

So I've got a model passed in like so:

public class MainViewModel{
    public IList<SubViewModel> SubViewModels;
}

public class SubViewModel{
    public Guid Id;
    public string Name;
    public IList<Guid> CategoryIds;
    public IList<CategoryType> CategoryTypes;
}

public class CategoryType {
    public Guid Id;
    public string Type;
}

Now in my javascript I take my model and convert:

var initialData = @Html.Raw(JsonConvert.SerializeObject(Model, new JavaScriptDateTimeConverter()));

var mainViewModel = new MainViewModel(initialData);

 

function MainViewModel(data) {

    var mapping = {

        'SubViewModels':

            create: function(options) {

                return new SubViewModel(options.data);

            }

    }

    ko.mapping.fromJS(data, mapping , this);

}

 

function SubViewModel(
     var self = this;



    ko.mapping.fromJS(data, mapping , self);

 

    self.CategoryMultiSelect: function (container, options) {

        $('<input data-bind="value:' + options.field + '"/>')

            .appendTo(container)

            .kendoMultiSelect({

                autoBind: false,

                dataTextField: "Type",

                dataValueField: "Id",

                dataSource: options.model.CategoryTypes

            });

    }

}

ko.applyBindings(mainViewModel, $("#MainViewModel")[0]);

Now when I call the editor function in the grid: 

<div id="subviewModelGrid" data-bind="kendoGrid: {

        data: $data.SubViewModels,

        sortable: true,

        scrollable: false,
           editable: true,

        pageable: { pageSize: 10, input: false },

        columns: [{

            field: 'CategoryIds',

            title: 'Categories',

            width: '300px',

            editor: $data.CategoryMultiSelect

        }]}"/>

After click on the column I get the following error: 

Uncaught TypeError: Object f7ae02dc-c8a7-f112-e043-991018ace7d8 has no method 'get' kendo.web.min.js:12
S.widget.value.m.extend.refresh kendo.web.min.js:12
F.extend.bind kendo.web.min.js:11
v.extend.applyBinding kendo.web.min.js:12
v.extend.bind kendo.web.min.js:12
o kendo.web.min.js:11
o kendo.web.min.js:11
o kendo.web.min.js:11
s kendo.web.min.js:11
d.extend.refresh kendo.web.min.js:22
d.extend.init kendo.web.min.js:22
(anonymous function) kendo.web.min.js:9
p.extend.each jquery-1.8.2.min.js:2
p.fn.p.each jquery-1.8.2.min.js:2
e.fn.(anonymous function) kendo.web.min.js:9
T.extend.editCell kendo.web.min.js:17
r.incell.r.update.n.wrapper.on.on.n.timer kendo.web.min.js:17
p.event.dispatch jquery-1.8.2.min.js:2
g.handle.h

Which is referring to the only id in the array of 'CategoryIds'.  I'm putting this question in Multiselect because I am using editor functions for several other columns and not having this issue. Any thoughts?

[Georgi Krustev]

Hello Chudi,

 
You can try the latest internal build, as we introduced some fixes related to the value binding of the MultiSelect widget. If the problem still persists I will need a repro test project in order to investigate the issue locally.

All the best,
Georgi Krustev
the Telerik team

[Chudi]

Yes thank you that did work for me. I noticed however that instead of now needing a List<Guid> for my selected values, I need to use List<CategoryType>. It appears to push the whole object into my selected values array. Is this the way it's going to be in the future?

[Georgi Krustev]

Hello Chudi,

 
You will need to pass a List<CategoryType> only if you need to show pre-selected items with initially empty dataSource ( not bound ). If the autoBind is set to true, you still can pass List<Guid>.

All the best,
Georgi Krustev
the Telerik team

[Chudi]

Thanks a lot! That helped quite a bit. I had two more questions with Multiselect.
1. Is it possible to leave the multiselect box open until the user is done selecting their multiples?
2. After I set navigatable to true in the grid, clicking on the multiselect box with the mouse opens and closes the multiselect element very quickly. I can now only modify the multiselect box by using alt-down. I've just upgraded to Version 2013.1.514 but the same issue is occuring. Any thoughts?

[Georgi Krustev]

Hello Chudi,

 
Straight up to your questions:

#1:
The MultiSelect widget is designed to close the popup on every selection. Hence it cannot leave popup opened until user ends with his selection.

#2:
Unfortunately, the Grid keyboard navigation does not support editing with complex widgets, like the MultiSelect. We logged this issue in our backlog for further investigation. We will try to address the problem as soon as possible.

All the best,
Georgi Krustev
the Telerik team

[Chudi]

Ok thanks you've been very helpful. Although it was designed to do so, if a user was intending to select multiple items I do not see the reasoning behind closing it on every selection especially without leaving the developers an option to leave it open. That being said after the last two months with the Kendo UI suite I'm very impressed and thank you and your team for the good work and punctual responses on your forums.