The following code shows an alert box:
<head>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</head>
<body>
    <div class="container">
        <h2>Dismissal Alert Messages</h2>
        <div class="alert alert-success alert-dismissable">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            Success! message sent successfully.
        </div>
    </div>
</body>
I want to show alert box on button click , can anyone help me to do so?
To close the alert message, add a . alert-dismissible class to the alert container. Then add class="close" and data-dismiss="alert" to a link or a button element (when you click on this the alert box will disappear).
Alert Links Add the alert-link class to any links inside the alert box to create "matching colored links": Success!
This jsfiddle shows how you can show a bootstrap alert box on click
http://jsfiddle.net/g1rnnr8r/2/
You need to implement jquery's show() method. The code you need to use is. 
$(document).ready(function(){
    $('button').click(function(){
        $('.alert').show()
    }) 
});
                        If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With