Use validation html5 and send form by ajax

I'm trying to send a form that is inside a modal using ajax and use the validations of html5, but when doing this and clicking on the send button, it redirects me to the page where the form data was sent.

<div class="modal fade" id="modalNuevo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Agregar Cargo/Cuota</h4>
      </div>
      <div class="modal-body">
      <form action="php/addEdoFinanciero.php" accept-charset="utf-8" method="POST" name="from_addEdoFinanciero" id="from_addEdoFinanciero">
          <label>Fecha del Cargo/Cuota:</label>
          <input type="text" name="date_add" id="datepicker1" class="form-control" required >
          <label>Concepto:</label>
          <input type="text" name="concepto_add" id="concepto" class="form-control input-sm" required >
          <label>Monto:</label>
          <input type="number" name="monto_add" id="monto" class="form-control input-sm" placeholder="100.00" required >
      </div>
      <div class="modal-footer">
      <button class="btn btn-primary" id="new_EdoFinanciero" >Enviar</button> 
      </div>
      </form>       
    </div>
  </div>
</div>

this is the javascript code

if (from_addEdoFinanciero.checkValidity()){
$(function(){
 $("#new_EdoFinanciero").click(function(){
    //event.preventDefault();// Aqui evitamos que el formulario haga el submit
    var frmData = new FormData($("#from_addEdoFinanciero")[0]);/*elegimos el id del formulario y empieza desde la posicion 0*/
    $.ajax({
           type: "POST",
           url: "php/addEdoFinanciero.php",
           data: frmData, 
           contentType: false,
           processData: false,

            success:function(r){
                if(r==1){   
                    $('#modalNuevo').modal('hide');
                    $('.modal-backdrop').remove();
                    $('#tabla').load('componentes/tablaEdoFinanciero.php');//FUNCION PARA CARGAR LA TABLA 
                    alertify.success("Datos Enviados");
                }else {
                    if (r==2) {//si hubo error en los datos
                        $("#modalErrores").modal("show");
                        alertify.error("Error en los datos");
                    } else{
                        alertify.error("Fallo el servidor");
                    }
                }
            }
         });//cierra ajax

    return false; // Evitar ejecutar el submit del formulario.
 });//cierra funcion de click
});//cierra function
}

My question is if you can avoid being sent to addEdoFinanciero.php, and try to change it by input type="submit" and occupy the preventDefault, but the same thing happens. This is the javascript code that worked for me to do what I want, but now after clicking on send the form (the data is sent and the modal is removed), if I want to open the modal again it appears and is removed immediately and the dark screen remains with the modal modality backdrop. Any idea why?

  $(document).ready(function(){
 $("#new_EdoFinanciero").click(function(){
    if($("#from_addEdoFinanciero")[0].checkValidity()){
    //event.preventDefault();// Aqui evitamos que el formulario haga el submit
    var frmData = new FormData($("#from_addEdoFinanciero")[0]);/*elegimos el id del formulario y empieza desde la posicion 0*/
    $.ajax({
           type: "POST",
           url: "php/addEdoFinanciero.php",
           data: frmData, // Adjuntar los campos del formulario enviado.
           contentType: false,
           processData: false,

            success:function(r){
                if(r==1){   
                    $('#modalNuevo').modal('hide');//cerramos el modal de nuevo 
                    //$('body').removeClass('modal-open');
                    $('.modal-backdrop').remove();//para quitar la sombra del modal
                    $('#tabla').load('componentes/tablaEdoFinanciero.php');//FUNCION PARA CARGAR LA TABLA 
                    alertify.success("Datos Enviados");
                }else {
                    if (r==2) {//si hubo error en los datos
                        //$("#modalErrores").modal("show");
                        alertify.error("Error en los datos");
                    } else{
                        alertify.error("Fallo el servidor");
                    }
                }
            }
         });//cierra ajax
       return false; // Evitar ejecutar el submit del formulario.+
    }
});//cierra funcion de click

});