Home Bootstrap How to use Jquery modal dialog prompt by using bootstrap bootbox JS?

How to use Jquery modal dialog prompt by using bootstrap bootbox JS?

by Shahriar Sagor

Today now in this post i will show you how to use Jquery modal dialog prompt by using bootstrap bootbox JS? Sometimes need to use prompt also with input field in our project. Because if we are use prompt modal is very interesting and also specially for our GUI. Always we are like to use prompt modal for the creating data or editing data and also for the conformation.

So now in this example i will use bootbox JS for prompt modal also with input value on that way we can get input value easily.

So i hopw you can try this on your project:

Example:
<html lang="en">
<head>
    <title>Jquery - bootstrap Prompt modal using bootbox.js</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script> 
</head>
<body>


<div class="container text-center">
     <h2>Jquery - bootstrap Prompt modal using bootbox.js</h2>
     <button class="btn btn-success">Click Here</button>
</div>	


<script type="text/javascript">
  $("button").click(function(){
      bootbox.prompt("Write sometext here?", function(result) {                
            $("button").after("<br/>Your Text: " + result);
      });
  });
</script>
</body>
</html>

Read Also : How to check file size when select multiple file validation by using Jquery?

Thanks for read. I hope it help you. For more you can follow us onĀ facebook.

close

You may also like