admin

02 April 2018

No Comments

Home JQuery

How to use Bootbox with JQuery

How to use Bootbox with JQuery

Today let us learn how to show effective alert box in JQuery. To achieve this we have to use BootboxBootbox is a free plugin which is used to display an effective message on the website. Bootbox depends on JQuery and Bootstrap, So we are required to download the reference files of JQuery and Bootstrap.

The links given below are for your reference, you can download all the required files from the given links.

  • JQuery
  • BootStrap
  • Boobox
  • Notepad++ (You can use your favorite one)

Once you are ready to start coding just refer the HTML Code below.

HTML Code1.  <html>
2.  <head>
3.  <title>
4.  How to show effective alertbox using BootBox in JQuery
5.  </title>
6.  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css">
7.  </head>
8.  <body>
9.  <button onclick="showMessage()" class="btn btn-default">Click here</button>
10. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
11. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" ></script>
12. <script src="bootbox.min.js"></script>
13. <script>
14. function showMessage(){
15. bootbox.alert("Welcome to GyaanShastra.com", function() {
16. //Callback code will come here.
17. alert("You are clicked on button.");
18. });
19. }
20. </script>
21. </body>
22. </html>

Other Sources

  • Bootbox Official Documentation
  • Bootbox Live Examples

Author: admin

Leave a Reply

Your email address will not be published. Required fields are marked *