Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Attach JBox tooltip to disabled button #214

Open
JayH77 opened this issue Feb 22, 2023 · 2 comments
Open

Attach JBox tooltip to disabled button #214

JayH77 opened this issue Feb 22, 2023 · 2 comments

Comments

@JayH77
Copy link

JayH77 commented Feb 22, 2023

Is is possible to attach a jbox tooltip to a disabled button? I'd like to inform the user the reasons the button is disabled using a tooltip.

I've disabled the button like so:

$('.btn-print').attr('disabled', true);

(Have also tried $('.btn-print').prop('disabled', true); )

And attaching the tooltip as:

new jBox('Tooltip', {
attach: '.btn-print'
});

Obviously if I hover of the button, the cursor changes to not allow but the jbox doesn't appear. If I comment out the disable, it works fine.

@StephanWagner
Copy link
Owner

It's probably because a disabled button doesn't trigger cursor events. I tried to attach the jBox to the container and then check in the onOpen method if the button is disabled to decide if the tooltip should be shown. But unfortunately this didn't work properly. See more here: whatwg/html#5886

You could use CSS to show that the button is disabled and handle the functionality of the disbaled button manually as a workaround.

@scottaohara
Copy link

scottaohara commented Mar 7, 2023

you should probably provide the reasoning for why the button is disabled via other means. as someone using keyboard would be unable to access the tooltip, since the control won't take focus.

this (having a tooltip on a disabled button that is only available to those who can hover with a mouse) would reasonably be flagged in an accessibility audit.

All that said, playing around with the demo site, i can't access a tooltip with keyboard on enabled controls (let alone see where my focus indicator is). So seems there are even bigger accessibility issues to resolve.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants