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

Ability to add listeners directly to objects like Modals/Collapse/etc #31266

Open
arcanedev-maroc opened this issue Jul 9, 2020 · 5 comments
Open

Ability to add listeners directly to objects like Modals/Collapse/etc #31266

arcanedev-maroc opened this issue Jul 9, 2020 · 5 comments
Labels
feature js v5
Projects
Feature ideas

Comments

@arcanedev-maroc
Copy link

arcanedev-maroc commented Jul 9, 2020 •
edited

How about a public method to add listener(s) to an object, something like:

class Modal {
    //...

    on(event, callback) {
        this._element.addEventListener(`${event}${EVENT_KEY}`, callback);

        return this;
    }

    //...
}

This will allows us to do something like:

var myModal = new bootstrap.Modal(document.getElementById('myModal'));

myModal
    .on('shown', function (e) {
        // do something...
    })
    .on('hidden', function (e) {
        // do something...
    });

Instead of:

var myModal = new bootstrap.Modal(document.getElementById('myModal'));

myModal._element.addEventListener('shown.bs.modal', function (e) {
    // do something...
});
myModal._element.addEventListener('hidden.bs.modal', function (e) {
    // do something...
});
@arcanedev-maroc arcanedev-maroc mentioned this issue Jul 9, 2020
Merged
@arcanedev-maroc arcanedev-maroc changed the title [Feature][v5] Ability to add listeners directory to objects like Modals/Collapse/etc [v5] Ability to add listeners directory to objects like Modals/Collapse/etc Jul 9, 2020
@arcanedev-maroc arcanedev-maroc changed the title [v5] Ability to add listeners directory to objects like Modals/Collapse/etc [v5] Ability to add listeners directly to objects like Modals/Collapse/etc Jul 9, 2020
@Johann-S
Copy link
Member

Johann-S commented Jul 9, 2020

Hi @arcanedev-maroc,

Thanks I think it's a good idea, it'll be easier to listen to our events 👍

Any other thoughts @twbs/js-review ?

@arcanedev-maroc arcanedev-maroc changed the title [v5] Ability to add listeners directly to objects like Modals/Collapse/etc Ability to add listeners directly to objects like Modals/Collapse/etc Jul 9, 2020
@bardiharborow
Copy link
Member

I think this would make a prudent addition.

@XhmikosR XhmikosR added this to JS behaviors in Feature ideas Jul 13, 2020
@XhmikosR
Copy link
Member

PRs welcome, but the sooner the better before v5 hits stable :)

@arcanedev-maroc arcanedev-maroc mentioned this issue Nov 17, 2020
Closed
11 tasks
@arcanedev-maroc
Copy link
Author

Hi @XhmikosR, i've created a PR: #32184

@alecpl
Copy link
Contributor

alecpl commented Jun 25, 2021 •
edited

I would love if that supported chaining. E.g.

let modal = new Modal(element)
    .on('shown', e => {  })
    .show()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
feature js v5
Projects
No open projects
Feature ideas
JS behaviors
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Ability to add listeners directly to objects like Modals/Collapse/etc ARCANEFORKS/bootstrap
5 participants
@XhmikosR @alecpl @bardiharborow @Johann-S @arcanedev-maroc