Подсказка не устанавливается внутри модального - PullRequest
Новая
       23

Подсказка не устанавливается внутри модального

0 голосов
/ 29 января 2019

Я пытаюсь установить всплывающую подсказку внутри модального окна, но в ней отображается только заголовок.

enter image description here

Я уже пробовал установить всплывающую подсказкукогда показывается модал, но ничего не происходит. 

$(ele).on('shown.bs.modal', function () {
   $('[data-toggle="tooltip"]').tooltip();
});

Кнопка выглядит так: 

<button class="btn btn-primary btn-select2" data-toggle="tooltip" type="button" data-placement="top" title="Selecionar todos"><i class="fas fa-check-double"></i></button>

Пока что даже название показывается.

Итак,У меня есть функция, которая при каждом открытии модального режима делает foreach, чтобы найти эти кнопки (чтобы выполнить другое действие), но я снова вставил title, data-original-title и tooltip, например: 

$('modal').find('.btn-select2').each(function() {
    $(this).attr('title', 'Selecionar Todos');
    $(this).attr('data-original-title', 'Selecionar Todos');
    $(this).data('placement', 'top');
    $(this).tooltip();
});

После этого заголовок начинает отображаться как изображение, но без подсказки.Любое решение?

РЕДАКТИРОВАТЬ: Вот HTML-код кнопки, которая вставляется внутри модального 

<div class="form-group">
    <label>Cargos</label>
    <div class="input-group input-group-select2">
        <select name="charges[]" class="form-control select2" multiple>
            @foreach($charges as $charge)
            <option value="{{$charge->id}}">{{$charge->name}}</option>
            @endforeach
        </select>    
        <div class="inpt-group-append">
            <button class="btn btn-primary btn-select2" data-tooltip="tooltip" data-toggle="tooltip" type="button" data-placement="top" title="Selecionar todos"><i class="fas fa-check-double"></i></button>
        </div>    
    </div> 
</div>

В конце документа я положил: 

$(function () {
    $('[data-toggle="tooltip"]').tooltip();
    $('.modal').on('shown.bs.modal', function () {
        $('[data-toggle="tooltip"]').tooltip();
    });
    $('.btn-select2').tooltip();
});

И есть некоторые модалы, которые используют функцию для открытия, и именно в этих модалах отображается заголовок, а подсказка - нет.В других модах, которые просто используют data-toggle, чтобы открыть, отображается даже заголовок.Вот код функции: 

const modalUpdate = function(obj, ele, hasSub = false) {
    $(ele).find('.btn-select2').each(function() {
        var button = this;
        var changeHeight = function () {
            var newHeight = $(button).parent().parent()[0].children[1].children[0].children[0].clientHeight;
            button.style = 'height: ' + (newHeight + 2) + 'px!important';
        }
        setTimeout(function() {
            changeHeight();
        }, 200);
        $(this).attr('title', 'Selecionar Todos');
        $(this).attr('data-original-title', 'Selecionar Todos');
        $(this).data('placement', 'top');
        $(this).tooltip();
    });
}
...