This is a migrated thread and some comments may be shown as answers.

Can't add a new item in MultiSelect controller options list and selected list.

2 Answers 45 Views
MultiSelect
This is a migrated thread and some comments may be shown as answers.
Chuanlong
Top achievements
Rank 1
Chuanlong asked on 27 Mar 2014, 03:28 AM
Hi experts,

I'm using Kendo MultiSelect controller, I use MVVM design to bind this controller to a viewModel.
1. 
<select id="selectedCategories" style="width: 700px" data-role="multiselect" data-value-field="name" data-text-field="name" data-bind="source: selectedCategoryOptions, value: selectedCategory, events: { change: selectedCategoryChange }" />
2. 
var viewModel = kendo.observable({
        selectedCategory: [],
        selectedCategoryOptions: [],
});
3.
        var preCustomSubCategories = ["newItem1"];
        var selectedCategory = viewModel.selectedCategory;
        var selectedCategoryOptions = viewModel.selectedCategoryOptions;
        for (var i = 0; i < preCustomSubCategories.length; i++) {
            var item = { name: preCustomSubCategories[i] };
            if (!IsInCategoryArray(item, selectedCategory)) {
                selectedCategory.push(item);
            }
            if (!IsInCategoryArray(item, selectedCategoryOptions)) {
                selectedCategoryOptions.push(item);
            }
        }
        viewModel.set("selectedCategoryOptions", selectedCategoryOptions);
        viewModel.set("selectedCategory", selectedCategory);

If preCustomSubCategories item is exist in the options, it will be selected; but if preCustomSubCategories item is not exist in the options, it will be added to both options list and select list, but in the controller UI show nothing select. It's interesting that when i select a newItem2  again, the previous added newItem1 will show in controller UI, but newItem3 not show in controller UI.


















2 Answers, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 31 Mar 2014, 07:13 AM
Hello Chuanlong,

I prepared a simple jsBin demo in my attempt to replicate the issue, but to no avail. One possible cause of this issue could be an invalid HTML. I noticed that the declared SELECT element does not have a closing tag, which is required. If the problem still persists  I will ask you to modify the demo in order to reproduce it. Thus I will be able to investigate it locally and advice you further.

Regards,
Georgi Krustev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Chuanlong
Top achievements
Rank 1
answered on 31 Mar 2014, 09:53 AM
Hi Georgi,

Thanks a lot for your comments, I have tried you demo, it works. So I compare my code to you carefully, you can see that I do the push item to "selected list" and "option list" in wrong order. I should push to "option list" first and then push to "selected list". I have resolved this issue, thank you again, your comments are really helpful~ 

 for (var i = 0; i < preCustomSubCategories.length; i++) {
            var item = { name: preCustomSubCategories[i] };
            if (!IsInCategoryArray(item, selectedCategory)) {
                selectedCategory.push(item);
            }
            if (!IsInCategoryArray(item, selectedCategoryOptions)) {
                selectedCategoryOptions.push(item);
            }
        }
Tags
MultiSelect
Asked by
Chuanlong
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Chuanlong
Top achievements
Rank 1
Share this question
or