Hola comunidad espero me puedan ayudar tengo este problema con modales de bootstrap 4 de antemano les agradezco su ayuda.
Tengo una modal principal donde cargo los datos de mi grid en controles input para actualizarlos en la base de datos utilizando ajax. Por lo que al momento de dar clic en el botón de actualizar necesito mostrar otra modal con la leyenda de que los datos han sido actualizados correctamente.
El problema es que la segunda popup no se muestra pero si le coloco una alerta esta si se muestra.
Este es mi código.
// Para poder actualizar estoy utilizando ajax
$("#btnActualizar").click(function() {
$.ajax({
type: "POST",
datatype: "json",
url: "Nombre_Formulario/Nmbre_Metodo",
contentType: "application/json; charset=utf-8",
data: //Aqui paso mis parametros esto funciona correctamente
cache: false,
success: function(data) {
$("#popup_Mensaje").modal('show'); // La modal no se visualiza en pantalla.
// alert("Dato insertado correctamente"); // Esta alerta si se muestra
},
error: function(error) {
alert(error.responseText);
console.log(error.responseText);
jsonValue = jQuery.parseJSON(Error.responseText);
alert(error.respose.Text);
alert("Error");
}
});
});
<!-- Esta es la primera modal que se muestra -->
<!-- The Modal -->
<div id="popup_Actualizar" class="modal fade" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal body -->
<div class="modal-body">
Aqui van los inputs con la informacion no lo coloco para no hacer muy extenso el codigo pero esta parte funciona correctamente
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="btnCancelar" class="btn btn-danger btn-block" data-dismiss="modal">Cancelar
</button>
<button type="btnActualizar" class="btn btn-primary btn-block">Actualizar
</button>
</div>
</div>
</div>
</div>
<!-- Esta es la segunda modal que intento mostrar -->
<!-- The Modal -->
<div id="popup_Mensaje" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal body -->
<div class="modal-body">
Su registro se ha actualizado correctamente.
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="btnAceptar" class="btn btn-danger btn-block" data-dismiss="modal">Aceptar
</button>
</div>
</div>
</div>
</div>