Jquery modal dialog prompt using bootstrap bootbox JS example

By Hardik Savani | June 16, 2016 | | 6294 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>