Opened 2 years ago

Closed 22 months ago

Last modified 22 months 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 scottgonzalez

  • Keywords a11y added
  • Status changed from new to open
  • Summary changed from Cannot show checked radio button in the content to Tooltip: 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 follow-up: Changed 2 years ago by scottgonzalez

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 23 months ago by scottgonzalez

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 22 months ago by Jiabao Wu

  • Resolution set to fixed
  • Status changed from open to closed

Tooltip: Remove name attribute from elements in the live region

Fixes #11272 Closes gh-1544

Changeset: 2cef124bf27ce89f1fbfc493352ebfd895b40822

comment:8 Changed 22 months ago by scottgonzalez

  • Milestone changed from none to 1.12.0
Note: See TracTickets for help on using tickets.