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.

Sign up for GitHub

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

Jump to bottom

data-toggle-group with data-toggle-outside does not work #16

Closed
jenstornell opened this issue Aug 30, 2018 · 1 comment
Closed

data-toggle-group with data-toggle-outside does not work #16

jenstornell opened this issue Aug 30, 2018 · 1 comment
Labels
help wanted Extra attention is needed

Comments

@jenstornell
Copy link

Overall, this lib works great. However I could not get it work with data-toggle-outside. Does it work with data-toggle-group?

My code

I've shorten it down a bit to only include the important parts.

<li data-toggle-class="active" data-toggle-target="widget-create-file" data-toggle-group="tabsGroup" data-toggle-outside>
</li>
<li data-toggle-class="active" data-toggle-target="widget-create-folder" data-toggle-group="tabsGroup" data-toggle-outside>
</li>

<widget-create-file>
</widget-create-file>

<widget-create-folder>
</widget-create-folder>

What I want is that when I click outside of both my buttons and my targets, my targets should hide no matter what the current state is.

I use Google Chrome latest on Windows.

I also tried a few other crazy things that did not work, like this:

<body data-toggle-trigger-off data-toggle-group="tabsGroup">

Any ideas?

I could do it with javascript, but it would be nice to be able to pull it off with this lib.
@Twikito
Copy link
Owner

Twikito commented Aug 31, 2018

Thanks for taking time to report this issue.
An element with data-toggle-trigger-off attribute must be placed inside a target element.
I think this should work:

<li data-toggle-class="active" data-toggle-target="widget-create-file" data-toggle-group="tabsGroup" data-toggle-outside>
</li>
<li data-toggle-class="active" data-toggle-target="widget-create-folder" data-toggle-group="tabsGroup" data-toggle-outside>
</li>

<widget-create-file>
    <button data-toggle-trigger-off></button>
</widget-create-file>

<widget-create-folder>
    <button data-toggle-trigger-off></button>
</widget-create-folder>

@Twikito Twikito added the help wanted Extra attention is needed label Aug 31, 2018
@Twikito Twikito closed this as completed Sep 6, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
help wanted Extra attention is needed
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@jenstornell @Twikito