Fiz uma página de teste com apenas nome e email, sem configuração nenhuma. [**DEMO**][1] **PedidosCLientes.php** <form id="contact_form" class="contact-form" method="post"> <ul class="row"> <li class="col-sm-12"> <label> <input type="text" class="form-control" name="cliente_nome" id="nome" placeholder="Nome *" x-moz-errormessage="campo obrigatório" required /> </label> </li> <li class="col-sm-6"> <label> <input type="text" class="form-control" name="cliente_email" id="email" placeholder="E-mail *" required x-moz-errormessage="campo obrigatório" /> </label> </li> <li class="col-sm-6"> <label> <input type="text" class="form-control" name="cliente_telefone" id="telefone" placeholder="Telefone *" required x-moz-errormessage="campo obrigatório" /> </label> </li> <li class="col-sm-6"> <label> <input type="text" class="form-control" name="cliente_bairro" id="bairro" placeholder="Bairro *" required x-moz-errormessage="campo obrigatório" /> </label> </li> <li class="col-sm-6"> <label> <input type="text" class="form-control" name="cliente_rua" id="rua" placeholder="rua *" required x-moz-errormessage="campo obrigatório" /> </label> </li> <li class="col-sm-6"> <label> <input type="text" class="form-control" name="cliente_complemento" id="complemento" placeholder="complemento *" /> </label> </li> </ul> <div class="col-sm-12 text-center"> <input type="submit" id="bt-confirmar" class="btn btn-default " value="CONFIRMAR" name="confirmar" /> </div> </form> <div id='myModal' class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title text-success">Cliente cadastrado com sucesso</h4> </div> <div class="modal-footer"> <button type="button" class="btn btn-success" data-dismiss="modal">Close</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script type="text/javascript"> jQuery(document).ready(function(){ jQuery('#contact_form').submit(function(){ var dados = jQuery( this ).serialize(); jQuery.ajax({ type: "POST", url: "connectpedido.php", data: dados, success: function( data ) { $('#myModal').modal('show'); } }); return false; }); }); </script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> **connectpedido.php** >Pode retirar essa linha `echo "Cliente cadastrado com sucesso!";` **Explicação** Para enviar formulário para o php sem refresh primeiro importe a lib jQuery: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> e dispare a função no evento onsubmit do formulário: `jQuery('#contact_form').submit(function(){` Vi alguns tutoriais( de blogs, fóruns e video aulas ), usando o evento onclick do botão submit(ou button), “fingem”, que isso funciona, e depois várias pessoas vão aos fóruns, por causa dos problemas gerados por esses códigos mal escritos e incorretos. O correto é usar no onsubmit do form, e “desativar” ele, com aquele return false; O método .serialize(), cria a query string com os dados do formulário, e usa essa variável para enviar a função ajax. No success: function( data ), é o callback que será disparado, onde será chamada a janela do modal. [1]: http://kithomepage.com/sos/PedidosCLientes.php