Bootbox in Focus Jquery

by wilson Rosa Gomes

HTML

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<form>
<input type="text" id="nome" name="nome" />
<input type="text" id="sobrenome" name="sobrenome" />
</form>

<button type="button" id="btnAlerta">Go action</button>

CSS

.box{
    background-color: rgb(96, 125, 139);
    width: 70%;
    color: cornsilk;
    box-shadow: rgb(3, 169, 244) 2px 2px 20px;
}
.titulo{
  text-align: center;
    font-size: 15pt;
    color: cyan;
    text-transform: capitalize;
    margin-top: 5%;
    padding-top: 5%;
}
.botao{
    float: right;
    background-color: #acdcda;
    color: cornsilk;
    box-shadow: 2px 2px 10px 2px #009688;
    padding: 2%;
    /* color: black; */
    text-shadow: 2px 2px 5px #d40000;
    cursor:pointer;
}
.fechar{
    float: right;
    color: cornsilk;
    background-color: red;
    cursor:pointer;
}

JavaScript

$(function(){
	$('#btnAlerta').on('click',function(){
		falert('tĂ­tulo do modal','mensagem que deseja exibir ','#nome');
	});
});
function falert(tit,msg,obj){
    var box = bootbox.alert({
        size: 'small',
        title: tit,
        message:'<p class="text-danger" style="margin:3%;padding:3%;">'+msg+'</p>'
    });
    setTimeout(function(){ 
        $('div.bootbox.modal').addClass('box');
$('div.bootbox.modal .modal-dialog div.modal-header h4.modal-title').addClass('titulo');
        $('div.bootbox.modal .modal-dialog div.modal-footer button').addClass('botao').text('Fechar');
    },100);
    $('div.bootbox.modal .modal-dialog div.modal-header button').addClass('fechar');
    box.on('hidden.bs.modal',function(){
        $(obj).focus();
    });
}