All geek questions in one place

How to display a warning in Bootstrap Modal

$(window).load(function(){ $('.alertbox').click(function(){ alert('You Clicked on Click Here Button'); }); }) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> </script> <div> <a class="alertbox" href="#clicked"> Click Here</a> </div>

I want the warning to appear in the Modal boot module.

+5
source share
2 answers

Create a div error in the modal body. and set the error

 $(document).ready(function(){ $('#alertbox').click(function(){ $("#error").html("You Clicked on Click here Button"); $('#myModal').modal("show"); }); }); 
 <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Modal Example</h2> <!-- Trigger the modal with a button --> <button type="button" class="btn btn-info btn-lg" id="alertbox">Click here</button> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Modal Header</h4> </div> <div class="modal-body"> <p id="error"></p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> </div> </body> </html>
+10
source

I may not have correctly understood your question, but you cannot use the warning function to display a message inside a page element. Alert displays a system warning outside the dom page.

If you want to display the message inside the modal code, you must enable (or enter) the modal markup on the html page, then you just show / hide the modal functions using the bootstrap functions.

You have a very good example here.

+1
source

Source: https://habr.com/ru/post/1247759/

More articles:


All Articles