JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<a href="#feedback" data-toggle="modal" class="btn btn-primary"><span class="glyphicon glyphicon-comment"> FeedBack</span></a>


<div id="feedback" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="feedback" aria-hidden="true">
		<div class="modal-dialog">
		<div class="modal-content">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			<h4 class="modal-title">FeedBack - Opina sobre el producto IDA4</h4>
		</div>
		<div class="modal-body">
			<form class="form-horizontal" method="POST" href="#" role="form" id="contact" data-async data-target="#feedback">
    			<div class="form-group">
        			<label class="control-label col-sm-2" for="code">Registro</label>
       				<div class="col-sm-offset-1 col-sm-9">
            			<input type="text" class="form-control" id="code" name="code" value="P087654" readonly />
        			</div>
    			</div>
    			<div class="form-group">
        			<label class="control-label col-sm-2" for="lastname">Nombre</label>
        				<div class="col-sm-offset-1 col-sm-9">
            				<input type="text" class="form-control" id="lastname" name="last_name" value="Alexander Gavancho" readonly />
        				</div>
    			</div>
				<div class="form-group">
        			<label class="control-label col-sm-2" for="comment">Comentario</label>
        			<div class="col-sm-offset-1 col-sm-9">
            			<textarea rows="6" class="form-control" id="comments" name="comments" placeholder="Ayudanos a mejorar con tu opinion."></textarea>
        			</div>
    			</div>
    			<div class="form-group">
        			<div class="col-sm-12">
            			<button type="submit" value="submit" id="submit" class="btn btn-info pull-right">Enviar</button>
        			</div>
   ...

CSS

.popover {
	background-color: #e74c3c;
	color: #ecf0f1;
	z-index: 2000;
}

.popover.left .arrow:after {
	border-left-color: #e74c3c;
}

JavaScript

$(document).on('submit', 'form#contact',function(event) {
    $('#submit').popover({ trigger:'mouseenter', content: 'Gracias por tu opinion', placement: 'left' });
    event.preventDefault();
});