Question

我正在尝试将多选下拉列表中的所选项目移动到另一个多选下拉列表中。在我的情况下，即使数据是可观察数组，选择列表也不会刷新。

我的代码在jsfiddle中。谢谢。

self.Move = function(){
    if (self.availableMAS.length > 0 && $('#selectedAttributes1 :selected').length > 0)
    {
        //self.selectedMAS = [];
        $('#selectedAttributes1 :selected').each(function(i, selected){ 
            self.selectedMAS.push(new MAs($(selected).val(), $(selected).text()));
            self.availableMAS.push(new MAs($(selected).val(), $(selected).text()));
            //alert($(selected).text() + $(selected).val());
            alert(self.selectedMAS.length);                
        });
    }

http://jsfiddle.net/balain/enjjx3q3/

Answer 1

看起来你发生了一些事情。您正在创建selectedMAS作为可观察数组，但随后将其分配给对象。此外，您没有利用按钮的数据绑定功能和选择控件。

查看此更新： http://jsfiddle.net/enjjx3q3/9/

更新了移动功能：

self.Move = function(){
    for( var i = 0, len = self.selectedItms().length; i < len; i++) {
        self.selectedMAS.push(self.selectedItms()[i]);
    }
};

更新了HTML：

<select  id="selectedAttributes1"
         data-bind="options: availableMAS, 
                    selectedOptions: selectedItms,                      
                    optionsText: 'Name'"
          multiple size="6">
</select>
<input id="btnMove" type=button value="Move" data-bind="click: Move" ></input>
<select id="selectedAttributes2"
        data-bind="options: selectedMAS,                         
                   optionsText: 'Name', 
                   selectedOptions: selectedMAS"
        multiple size="6">
</select>

Answer 2

首先，在以下行中：

vm.selectedMAS = [new MAs(1, 'Name1')];

您正在使用裸（不可观察）数组替换selectedMAS，而不是调用其push方法：

vm.selectedMAS.push(new MAs(1, 'Name1'));

而且，重点是您需要使用selectedOptions绑定处理程序来实现多个选项检查：

<select multiple size="6" data-bind="options: availableMAS,
                                     selectedOptions: selectedMAS,
                                     optionsText: 'Name'">
</select>

阅读时：

<select multiple size="6" data-bind="options: selectedMAS,                         
                                     optionsText: 'Name'">
</select>

请参阅Fiddle

Knockout多选选项不起作用

2 个答案: