Bootstrap-multiselect: onSelectAll não dispara o evento quando a opção "Selecionar tudo" é clicada

Criado em 2 jun. 2016  ·  6Comentários  ·  Fonte: davidstutz/bootstrap-multiselect

onSelectAll não dispara o evento quando a opção "Selecionar tudo" é clicada. Somente quando a última opção na lista é selecionada, o evento é disparado. O evento não é disparado quando desmarco a última opção da lista.

Sou novato em Javascript, por isso pode ser um erro meu, mas verifico se uso a última versão doe tento usar uma função simples como aqui (https://www.bountysource.com/issues/29165923-why-does-onselectall-function-is-triggered-when-nothing-is-selected).

Quando eu seleciono \ desmarque "Selecionar tudo", as opções na lista são alteradas, mas o evento não é disparado.
Quando todas as opções são selecionadas e eu desmarco uma e seleciono de volta - evento disparado. Recebi uma caixa de mensagem com o texto "onSelectAll triggered: deselected all!" (o valor "verificado" está errado)
Quando todas as opções são desmarcadas e eu desmarcar a última - o evento não é disparado.

Ao testar o exemplo aqui (http://davidstutz.github.io/bootstrap-multiselect/#configuration-options-onSelectAll), obtive o mesmo efeito - "Selecionar tudo" não dispara o gatilho. E quando eu desmarcar e selecionar novamente uma opção, recebo uma caixa de mensagem com o texto "onSelectAll triggered: deselected all!", Não com "onSelectAll triggered."

Pode ser um bug do meu navegador (Chrome 50.0.2661.102 m), mas também testei com o MS Edge 25.10586.0.0 e obtive o mesmo efeito.

Este é o meu código:

    // get SELECT item
var t_select = $('#tbl-columnList');

    // populate select with options - collumns of table in document
$('#report_userActionsLog_table th').each( function(d){    
            th_el = $(this);
            el_text = (th_el.text()? th_el.text(): th_el.children("img").attr("alt"));
            t_select.append( '<option value="'+d+'">'+el_text+'</option>' );     });    

    // init multiselect
t_select.multiselect({ 
    enableFiltering: false,
    maxHeight: 700,
    nonSelectedText: 'Колонки',
    includeSelectAllOption: true,
   // this event not work as expected
    onSelectAll: function(checked) {
                alert('onSelectAll triggered: ' + (checked ? 'selected all' : 'deselected all') + '!');
    },
    buttonWidth: 158,
    templates: {
        button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span> <b class="caret"></b></button>',
        ul: '<ul class="multiselect-container dropdown-menu" style="width: 200px"></ul>',
        filter: '<li class="multiselect-item multiselect-filter"><div class="input-group"><input class="form-control multiselect-search" type="text" style="width: 100px"></div></li>',
        filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default multiselect-clear-filter" type="button"><i class="glyphicon glyphicon-remove-circle"></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>'
    },
   // this event work fine
    onChange: function(element, checked) {
                $('#report_userActionsLog_table').DataTable().column($(element).val()).visible( checked );
    }

});

    // select all by default
t_select.multiselect('selectAll', false);
t_select.multiselect('updateButtonText');
bug

Comentários muito úteis

Fiz uma solicitação pull para resolver este problema: # 764

Todos 6 comentários

Acabei de encontrar isso sozinho, e o mesmo para a função onDeselectAll que não está documentada, mas no arquivo javascript. Eu sei que uma versão anterior funcionou. Eu descobri isso quando atualizei para a versão mais recente e minhas funções não estavam funcionando. Aqui está o código que estou usando. Vou editar a versão anterior do código que tenho para criar a função onDeselectAll para funcionar, mas seria bom ter esses recursos funcionando quando o usuário clicar nessa caixa de seleção.

$('.multiselect').multiselect({
                enableFiltering: true,
                enableCaseInsensitiveFiltering: true,
                includeSelectAllOption: true,
                includeSelectAllDivider: true,
                maxHeight: 400,
                onSelectAll: function () {
                    console.log("select-all-nonreq");
                },
                onDeselectAll: function () {
                    console.log("deselect-all-nonreq");
                }
            });

+1

Como uma correção temporária, basta substituir o parâmetro triggerOnSelectAll para selectAll / deselectAll na fonte

selectAll: function (justVisible, triggerOnSelectAll) {

            triggerOnSelectAll = true; //patch, broken
            var justVisible = typeof justVisible === 'undefined' ? true : justVisible;
...

Fiz uma solicitação pull para resolver este problema: # 764

Analisará a solicitação de pull.

Não funciona para mim
veja # 787

Qualquer ajuda?

Esta página foi útil?
0 / 5 - 0 avaliações