JavaScript Class To Create Bootstrap 5 Modal | BS5ModalJS

BS5ModalJS removes the hassle of manually writing HTML modal bootstrap 5 elements into the document.

These will be automatically created for you when you instantiate them and add them to your <body> document. Useful if you intend to add forms throughout your website.

How to make use of it:

1. Load the BS5ModalJS JavaScript library in your Bootstrap 5 undertaking.

<!-- Bootstrap 5 -->
<link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" />
<script src="/path/to/cdn/bootstrap.bundle.min.js"></script>

<!-- BS5ModalJS Library -->
<script src="BS5Modal.js"></script>

2. Create a brand new occasion of the Bootstrap 5 modal window.

// BSModal(id, title, message, callBack = null);
let myModal = new BSModal("myModal","Modal Title", "Modal Content?", function() {
    // do something
});

3. Create a toggle button to launch the modal window.

// toggleButton(innerText = "Submit", classes = "btn btn-outline-primary")
let toggleBtn = myModal.toggleButton("Launch", "btn btn-outline-danger");

4. Append the toggle button to the web page.

document.querySelector("#demo").appendChild(toggleBtn);

Tiny Bootstrap 5 Modal Generator, BS5ModalJS Plugin/Github


See Demo And Download

Official Website(babski123): Click Here

This superior jQuery/javascript plugin is developed by babski123. For extra Advanced usage, please go to the official website.

Share