0

Tengo el siguiente problema tengo un modal de bootstrap y estoy tratando de cargar una alerta para la eliminacion de un campo de tabla pero me muestra la alerta por detras del modal.

quisiera saber como puedo solucionar este problema gracias.

este es mi modal

    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header" style="background-color: #383085;">
                <h5 class="modal-title" id="exampleModalLabel" style="color: white">Editar parametros de la maquina</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: white">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" id="modaltable">
                <table class="table configmaquina">
                    <thead>
                        <tr>
                            <th style="background-color: #383085; color: white">Id</th>
                            <th style="background-color: #383085; color: white">Nombre</th>
                            <th style="background-color: #383085; color: white">Valor</th>
                            <th style="background-color: #383085; color: white">Descripcion</th>
                            <th style="background-color: #383085; color: white">Eliminar</th>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>

            </div>
            <div class="modal-footer" >
                <button class="btn btn-primary float-right" id="newcamp" >Agregar campo</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal" id="btncerra">Close</button>
                <button type="button" class="btn btn-primary" id="maquinacf">Guardar</button>
            </div>
        </div>
    </div>
</div>

y esta es la alerta, el problema es que me la carga por detrás del modal.

  Swal.fire({
        title: 'Are you sure?',
        text: "You won't be able to revert this!",
        icon: 'warning',
        position: 'top-end',
        backdrop: true,
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
        if (result.value) {
            Swal.fire(
                    'Deleted!',
                    'Your file has been deleted.',
                    'success'
                    )
        }
    });

1 respuesta 1

2

Agrega la siguiente propiedad y form-modal debe ser el ID de tu modal, funciona perfectamente

Swal.fire({ target: document.getElementById('form-modal'),

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.