Skip to content

Snackbar documentation doesn't include JS trigger instructions #238

Description

@cweitat

To add how to trigger snackbar with JS.
Adapted from docs.min.js. Code as such

//close snackbar on click
        $(".snackbar-btn").on("click", function () {
            $(this).parent(".snackbar").removeClass("show")
        });

//show snackbar on click and auto hide at either after 6000ms or button is click again to show new snackbar
        $(".snackbar-toggler").on("click", function () {
            var e = $(this).next(".snackbar");
            if ($(".snackbar.show").length > 0) {
                $(".snackbar.show").removeClass("show").one("webkitTransitionEnd transitionEnd", function () {
                    e.addClass(function () {
                        setTimeout(function () {
                            e.removeClass("show")
                        }, 6e3);
                        return "show"
                    })
                })
            } else {
                e.addClass(function () {
                    setTimeout(function () {
                        e.removeClass("show")
                    }, 6e3);
                    return "show"
                })
            }
        });

Activity

  1. sesemaya commented on Jan 6, 2020

    @sesemaya
    Contributor

    Hi @cweitat,

    Those code were temporary hacks for demo purposes only.

    We are upgrading Material to work with Bootstrap 4.4, and once done, toast should be triggered like https://getbootstrap.com/docs/4.4/components/toasts/#methods.

  2. djibe commented on May 8, 2020

    @djibe

    Hi, no need for custom snackbars anymore, just use Bootstrap toasts.

    https://djibe.github.io/material/docs/4.5/material/snackbars/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions