JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<button id="test">Bootbox</button>

JavaScript

$(document).ready(function() {
    
$("#test").on('click', function() {


bootbox.dialog({
    title: "This is a form in a modal.",
    message: '<div class="row">  ' +
    '<div class="col-md-12"> ' +
    '<form class="form-horizontal"> ' +
    '<div class="form-group"> ' +
    '<label class="col-md-4 control-label" for="name">Name</label> ' +
    '<div class="col-md-4"> ' +
    '<input id="name" name="name" type="text" placeholder="Your name" class="form-control input-md"> ' +
    '<span class="help-block">Here goes your name</span> </div> ' +
    '</div> ' +
    '<div class="form-group"> ' +
    '<label class="col-md-4 control-label" for="awesomeness">How awesome is this?</label> ' +
    '<div class="col-md-4"> <div class="radio"> <label for="awesomeness-0"> ' +
    '<input type="radio" name="awesomeness" id="awesomeness-0" value="Really awesome" checked="checked"> ' +
    'Really awesome </label> ' +
    '</div><div class="radio"> <label for="awesomeness-1"> ' +
    '<input type="radio" name="awesomeness" id="awesomeness-1" value="Super awesome"> Super awesome </label> ' +
    '</div> ' +
    '</div> </div>' +
    '</form> </div>  </div>',
    buttons: {
        success: {
            label: "Save",
            className: "btn-success",
            callback: function () {
                var name = $('#name').val();
                var answer = $("input[name='awesomeness']:checked").val()
                console.log(name + " " + answer);
            }
        }
    }
}
              );
    
   });
});