我正在使用淘汰 js 和选定的插件 （https://github.com/harvesthq/chosen） 来尝试制作一个好看的多选。
我已经尝试了各种方法，但无法让多选处理我正在使用的数据。 当我单击多选时，即使选项绑定包含正确的数据，也不会显示任何值。
.HTML：
<select multiple="multiple" data-bind="options: allCustomers,
selectedOptions: event().customers, optionsText: 'name',
optionsValue: 'id', chosen: true " ></select>
视图模型的简化版本：
function Event()
{
this.customers = ko.observableArray();
};
//for chosen plugin
ko.bindingHandlers.chosen = {
update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
$(element).chosen();
}
}
function ViewModel()
{
this.event = ko.observable(new Event());
this.allCustomers = ko.observableArray();
};
var viewModel = new ViewModel();
$.getJSON("/get_json", function(data)
{
for (var c = 0; c < data.customers.length; c++)
{
viewModel.allCustomers.push(data.customers[c]);
}
});
ko.applyBindings(viewModel);
.PHP：
function get_json()
{
$eventData = array(
'customers' => array(array('name' => 'Bob', 'id' => 1), array('name' => 'John', 'id' => 2)),
'moreData' => array(),
'evenMoreData' => array()
);
echo json_encode($eventData);
}
这显示了所选样式的选择框，但是当我单击它时，没有显示任何选项。
当我在视图模型中为客户创建一个本地 JS 数组并将其传递给 allCustomers 时，多选工作正常（请参阅我的 jsfiddle），因此这与从服务器获取数据有关，但我一直盯着这个一段时间，看不到问题！
任何帮助非常感谢
在@Tyrsius建议它可能在初始绑定后不会更新数据后，我发现了问题。
我$(element).trigger("liszt:updated");添加到自定义绑定中，如下所示：
ko.bindingHandlers.chosen = {
update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
$(element).chosen();
$(element).trigger("liszt:updated");
}
}
由于某种原因，接受版本中的代码对我不起作用。可能是因为liszt:updated命令没有触发选择更新。根据这里的文档，我编写了自己的版本：
ko.bindingHandlers.chosen = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
$(element).chosen({ width: "95%", placeholder_text_multiple: "Select..." });
var value = ko.unwrap(valueAccessor());
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
var value = ko.unwrap(valueAccessor());
$(element).trigger("chosen:updated");
}
}