Fixes #32153 - Hide tooltip on multiselect all buttons #8428
Conversation
|
Issues: #32153 |
theforeman-bot
added
Needs testing
Not yet reviewed
Legacy JS
| @@ -75,13 +75,15 @@ function sanitize(value){ | |||
| $(document).on('click', '.ms-select-all', function () { | |||
| // can't use multiSelect('select_all') because it adds filtered out items too. | |||
| $(this).closest('.form-group').find('.ms-selectable .ms-list :visible').click(); | |||
| $(this).tooltip('hide'); | |||
There was a problem hiding this comment.
Now after clicking and another refocusing, it stays open.
Should we destroy as well? I think the tooltips get created on the fly now, so it will get recreated right?
There was a problem hiding this comment.
hmmm, on additional testing looks like not all cases are properly handled:\ i'll work on it a bit further
There was a problem hiding this comment.
Turns out you can't destroy delegated tooltips - https://getbootstrap.com/docs/3.4/javascript/#tooltip-destroy. updated to hide on removal as well.
The tooltips remain shown on click because the elemnt they are attached
to is a `a` tag, which remains in focus until the user clicks elsewhere
so there is no `focusout` event fired.
For the deselect all button, the click handler calls
`multiSelect('refresh')` which in turn removes the multiselect element
(with the tooltip event handlers) from the DOM[1], leaving the tooltip
always displayed.
Since we only use tooltips for hover help, the `focus` trigger has been
removed. Popovers should be used when showing information that is
displayed on focus (i.e. when clicking on an element).
[1] https://github.com/lou/multi-select/blob/0.9.12/js/jquery.multi-select.js#L335
| @@ -63,6 +63,7 @@ export function activateTooltips(elParam = 'body') { | |||
| el.tooltip({ | |||
| selector: '[rel="twipsy"],*[title]:not(*[rel],.fa,.pficon)', | |||
| container: 'body', | |||
| trigger: 'hover', | |||
There was a problem hiding this comment.
The default for this is 'hover focus', however we don't actually use tooltips for places that require focus (we have popover for that).
|
[test foreman][test katello] |
The tooltips remain shown on click because the elemnt they are attached
to is a
atag, which remains in focus until the user clicks elsewhereso there is no
focusoutevent fired.For the deselect all button, the click handler calls
multiSelect('refresh')which in turn removes the multiselect element(with the tooltip event handlers) from the DOM[1], leaving the tooltip
always displayed.
[1] https://github.com/lou/multi-select/blob/0.9.12/js/jquery.multi-select.js#L335