大家早上好。我对引导多重选择有疑问,研究后无法显示选定的值。
然后我选择一些选项并进行搜索。
因此“ Arruolati”之类的信息确实发生了变化,但未显示multiselect的选定值。
这是最初填充多选内容的代码
<div class="form-group col-xs-12 col-md-12 col-lg-3">
<div class="col-xs-12 col-md-12 col-lg-12">
<select name="protocollo[]" id="protocollo" class="multiselect" multiple="multiple">
<?php foreach($this->protocolli_grouped_no_array as $p): ?>
<?php if($p->id_equipe == $this->id_equipe): ?>
<option <?php if(is_null($this->list_protocollo) || in_array($p->nome_categoria, $this->list_protocollo)): ?> selected <?php endif; ?> value="<?= $p->nome_categoria; ?>"><?= $this->translate($p->nome_categoria); ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
</div>
</div>
此js代码初始化多选
$('#protocollo').multiselect({
enableFiltering: true,
buttonWidth: '100%',
enableHTML: true,
maxHeight: 295,
includeSelectAllOption: false, //modificato button select all
buttonClass: 'btn btn-white',
templates: {
button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span> <b class="fa fa-caret-down"></b></button>',
ul: '<ul class="multiselect-container dropdown-menu"></ul>',
filter: '<li class="multiselect-item filter"><div class="input-group"><span class="input-group-addon"><i class="fa fa-search"></i></span><input class="form-control multiselect-search" type="text"></div></li>',
filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default btn-white btn-grey multiselect-clear-filter" type="button"><i class="fa fa-times-circle red2"></i></button></span>',
li: '<li><a tabindex="0"><label></label></a></li>',
divider: '<li class="multiselect-item divider"></li>',
liGroup: '<li class="multiselect-item multiselect-group"><label></label></li>',
},
buttonText: function(options, select) {
if (options.length === 0) {
return "Seleziona un protocollo" + ' <b class="fa fa-caret-down"></b>';//ACE
}
else if (options.length === $('option', $(select)).length) {
groupForLabel1 = i18n.translate("All protocols").fetch();
return i18n.translate("All protocols").fetch() + ' <b class="fa fa-caret-down"></b>';//ACE
}
else if (options.length > this.numberDisplayed) {
groupForLabel1 = options.length + ' ' + this.nSelectedText;
return options.length + ' ' + this.nSelectedText + ' <b class="fa fa-caret-down"></b>';//ACE
}
else {
var selected = '';
options.each(function() {
var label = ($(this).attr('label') !== undefined) ? $(this).attr('label') : $(this).html();
if (label.length>9){
label = label.substring(0,8) + '.';
}
selected += label + ' , ';
});
groupForLabel1 = selected.substr(0, selected.length - 2);
return selected.substr(0, selected.length - 2) + ' <b class="fa fa-caret-down"></b>';//ACE
}
},
/*buttonText: function(option, select) {
return i18n.translate('Protocol').fetch() + ' <b class="fa fa-caret-down"></b>';
}*/
});
并且此js代码用于在更改Equipe值时重新加载协议过滤器
$("#id_equipe")
.change(function(e){
var selected = this.value;
$protocollo = $('#protocollo');
$protocollo[0].options.length = 0;
var elements = [];
$.each(jsonProtocolliGrouped, function(key,value) {
if ((selected === '' && !JSON.stringify(elements).includes(JSON.stringify({label:value['nome_categoria'], value:value['nome_categoria']}))) || selected === value['id_equipe']) {
elements.push({label:value['nome_categoria'], value:value['nome_categoria']});
}
});
$protocollo.multiselect('dataprovider', elements);
$protocollo.multiselect('selectAll', false);
$protocollo.multiselect('refresh');
}).change();
我认为js函数在错误的时刻运行,并覆盖了正确的流程。 有可能吗?
谢谢大家