Q: Want to show a message after form submit Im building a form with a submit button who should popped up once all the required fields are filled up, the problem is the form is submitted and the alert finally dont display.
I would need the program to stop to get the message and then to be submitted after.
Here is the code:
    function enviar(){

            $.confirm({
                 title: 'Congratulations!',
                 content: 'Consider something great happened, and you have to show a positive message.',
                 type: 'green',
                 buttons: {

                     close: function(){
                     }
                 }
             });


        }
    }
<form class="formu">
            <div class="row">
                <div class="form-group col-md-6">
                    <label for="nombre" class="col-form-label">Nombre Concesionario(*)</label>
                    <input type="text" class="form-control" id="nomConcesionario" placeholder="Nombre Concesionario" required>
                </div>
                <div class="form-group col-md-6">
                    <label for="Nif" class="col-form-label">NIF(*)</label>
                    <input type="text" class="form-control" id="nifConcesionario" placeholder="Ejemplo NIF: A58818501" required>
                </div>
            </div>
            <div class="row">
                <div class="form-group col-md-6" >
                    <label for="ciudad" class="col-form-label">Ciudad(*)</label>
                    <input type="text" class="form-control" id="nomCiudad" placeholder="Ciudad" required>
                </div>
                <div class="form-group col-md-6">
                    <label for="cp" class="col-form-label">Codigo Postal</label>
                    <input type="text" id="cpConcesionario" placeholder="Codigo Postal" class="form-control">
                </div>
            </div>
            <div class="row">
                <div class="form-group col-md-6" >
                    <label for="ciudad" class="col-form-label">Telefono Contacto</label>
                    <input type="tel" class="form-control" id="tlf" placeholder="Telefono Contacto">
                </div>
                <div class="form-group col-md-6">
                    <label for="nom_admin" class="col-form-label">Nombre Administrador(*)</label>
                    <input type="text" id="nomAdministrador" placeholder="Nombre Administrador" class="form-control" required>
                </div>
            </div>


            <div class="row">
                <div style="width: 100%; margin: 0 25% 0 25%">
                    <input type="submit" id="bEnviar" class="btn btn-primary" onclick="enviar()" value="Dar de alta concesionario"> 
                </div>
            </div>

        </form> 


A: Remove onclick="enviar()" from the submit button and add onsubmit="enviar()" to your form.
Also add an argument (let's call it event) to your method and update it as it follows:
function enviar(event){
            event.preventDefault();
            $.confirm({
                 title: 'Congratulations!',
                 content: 'Consider something great happened, and you have to show a positive message.',
                 type: 'green',
                 buttons: {

                     close: function(){
                     }
                 }
             });


        }
    }

With that you'll avoid the page to reload before the alert is shown.
Hope this helps you!
