Opened 2 years ago

Closed 2 years ago

Last modified 2 years ago

#11272 closed bug (fixed)

Tooltip: Content cannot contain checked radio button

Reported by: allenstyle Owned by:
Priority: minor Milestone: 1.12.0
Component: ui.tooltip Version: 1.11.2
Keywords: a11y Cc:
Blocked by: Blocking:

Description

Hi,

Today, I tried to show "ToolTip" by using html content. It can display html well, but if I write down radio button in the html. "ToolTip" cannot show checked radio button. I goolged relative information, but I still cannot find any useful information.

Sample codes below:

$('.aToolTip').tooltip({
                         items: 'a',
                         content: function () {
                            return $('#divContent').html();
                    });

<div id="divContent">
     <input type="radio" name="hobby" checked="checked" /><label>Option 1</label>
     <input type="radio" name="hobby" /><label>Option 2</label>
</div>

If anyone get any idea, please tell me.

Thanks,

Allen

Change History (8)

comment:1 Changed 2 years ago by Scott González

Keywords: a11y added
Status: newopen
Summary: Cannot show checked radio button in the contentTooltip: Content cannot contain checked radio button

This happens because the live region gets a copy of the HTML, which results in the creation of more radio buttons, one of which is checked. The currently solution for just copying all the content and removing IDs is obviously flawed. I'm not really sure what we should do about that.

comment:2 Changed 2 years ago by jiabao

Hello this is the first time I am using the jquery bug system.

It might be a good idea to fix this. Not just in the live region which is for readers but also the tooltip content both cause this issue with radio buttons.

To fix this I created a Pull Request modifying the _open function to strip name and id from both which required first passing the accepted content type into DOM objects. here is the PR - https://github.com/jiabaowu/jquery-ui/pull/1

Incase it is decided that this stripping of name and id from tooltips is merged I also created a pull request for the unit tests associated with this new feature. PR - https://github.com/jiabaowu/jquery-ui/pull/2

Thanks a lot if you take a look at the PRs, I think its good to try to make tooltip as isolated as possible from the rest of the DOM.

comment:3 Changed 2 years ago by Scott González

Pull requests need to be made against http://github.com/jquery/jquery-ui, not against your own fork. Please read http://contribute.jquery.org/commits-and-pull-requests/.

comment:4 in reply to:  3 Changed 2 years ago by jiabao

Replying to scott.gonzalez:

Pull requests need to be made against http://github.com/jquery/jquery-ui, not against your own fork. Please read http://contribute.jquery.org/commits-and-pull-requests/.

Thanks for your reply. I will work on that now. (Sorry I was following an out-dated guide.)

comment:5 Changed 2 years ago by jiabao

I have updated the pull request to be made against http://github.com/jquery/jquery-ui, here https://github.com/jquery/jquery-ui/pull/1525

comment:6 Changed 2 years ago by Scott González

Note that the use case presented in the ticket will not be supported. If you're effectively cloning content that's already in the document, it's your responsibility to make sure that content will work. However, there is a bug similar to the use case provided (where the markup is new, not cloned), because we copy the markup into the live region. Only the markup going into the live region will be cleaned up (and hopefully one day we can just get rid of it).

comment:7 Changed 2 years ago by Jiabao Wu

Resolution: fixed
Status: openclosed

Tooltip: Remove name attribute from elements in the live region

Fixes #11272 Closes gh-1544

Changeset: 2cef124bf27ce89f1fbfc493352ebfd895b40822

comment:8 Changed 2 years ago by Scott González

Milestone: none1.12.0
Note: See TracTickets for help on using tickets.