Jquery modal dialog prompt using bootstrap bootbox JS example

By Hardik Savani | June 16, 2016 | | 44360 Viewer | Category : Bootstrap Bootbox.js


We sometimes need to use prompt with input in our project because if we use prompt modal is very interesting and specially for GUI. Always we like to use prompt modal for creating data or editing data and also for conformation. In this example i use bootbox JS for prompt modal with input that way we can get input value easily.

You can try this:

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>




Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
Follow Me: Github Twitter
***Do you want me hire for your Project Work? Then Contact US.