tengo este formulario que necesito validar con ajax para que en el momento que escriba muestre el error sin tener que actualizar la pagina para que finalmente valide y pueda darle al botón y valla a una url con los datos.
después que se apretar el botón esta envía al archivo de compra con los datos del formulario en POST y funciona, pero me falta validar este formulario para solo deje enviar una ves que los datos sean escrito correctamente y redirija al archivo de compra con los datos.
Formulario.php
<section class="container_form">
<div class="form">
<h2>Rellena el formulario para participar</h2>
<form action="<?php echo 'compra' ?>" method="post">
<div class="form-group">
<label for="nombres">Nombres</label>
<input type="text" class="form-control" name="nombres" id="" placeholder="Nombres">
</div>
<div class="form-group">
<label for="apellidos">Apellidos</label>
<input type="text" class="form-control" name="apellidos" id="" placeholder="Apellidos">
</div>
<div class="form-group">
<label for="rut">Rut</label>
<input type="text" class="form-control" name="rut" id="" placeholder="11111111-1">
</div>
<div class="form-group">
<label for="celular">Celular</label>
<input type="text" class="form-control" name="celular" id="" placeholder="985114418">
</div>
<div class="form-group">
<label for="correo">Correo electrónico</label>
<input type="email" class="form-control" name="email" id="" placeholder="[email protected]">
</div>
<div class="form-group">
<label for="recorreo">Repetir Correo electrónico</label>
<input type="email" class="form-control" name="reemail" id="" placeholder="[email protected]">
</div>
<div class="form-group custom-control custom-checkbox">
<input class="custom-control-input" type="checkbox" name="terminos" value="ok" id="customCheck" required>
<label class="custom-control-label" for="customCheck"><a href="">Acepto los términos y condiciones de las bases del concurso.</a> </label>
</div>
<button type="submit" name="submit_compra" class="btn btn-primary btn-block btn-success btn-lg">PAGA AQUÍ</button>
</form>
</div>
</section>
compra.php
<?php
//if (isset($_POST['submit_compra'])){
// print_r($_POST);
//}else{
// header('Location: '.$url.'formulario');
//}
//if(!$_POST){
// header('Location: '.$url.'formulario');
//}
?>
<section class="container_form">
<div class="form">
<h2>Selecciona la cantidad de ticket a comprar</h2>
<form action="">
<div class="form-group">
<label for="Número de ticket">Número de ticket</label>
<select name="cantidad" class="form-control" id="">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">3</option>
</select>
</div>
<div class="form-group">
<label for="nombres">Valor a pagar</label>
<input type="text" class="form-control" name="total" id="" placeholder="$15.000" disabled>
</div>
<button type="submit" class="btn btn-primary btn-block btn-success btn-lg">Pagar ticket</button>
</form>
</div>
</section>