Estuve indagando un poco. Tu código con los alert no me va bien porque el formulario hace la validación PHP en el servidor; devuelve el mismo formulario con los errores, o un mensaje de éxito. Quiero que éste mensaje se vea en la propia ventana modal (bootstrap)
He encontrado este código y he logrado que el formulario se envíe, pero la página todavía se recarga.
Código:
$(document).ready(function() {
$().ajaxStart(function() {
$('#loading').show();
$('#result2').hide();
}).ajaxStop(function() {
$('#loading').hide();
$('#result2').fadeIn('slow');
});
$('#register').submit(function() {
$.ajax({
type: 'POST',
url: $(this).attr('register.php'),
data: $(this).serialize(),
success: function(data) {
$('#result2').html(data);
}
})
return false;
});
})
El div#loading es un gif de precarga, no tiene importancia.
El div#result2 es donde debería cargar la respuesta del servidor que da el mismo "register.php"
Estuve tocando cosas y me da la sensación que el error está en la línea:
Código:
data: $(this).serialize(),
Hay algún error?
La página donde va el formulario "register.php", como dije antes, es un montón de código y no sé si tiene sentido ponerlo, pero por si acaso:
Código:
<?php include 'conex.php'; ?>
<div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Registrarse</h4>
</div>
<div class="modal-body">
<?php if (isset ($_POST["submit_reg"])){
//obtención de variables
$name = $_POST ["name"];
$surname = $_POST ["surname"];
if (empty($_POST ["provincia"])){$provincia="none";}else{$provincia = $_POST ["provincia"];}
$town = $_POST ["town"];
$postcode = $_POST ["postcode"];
$email = $_POST ["email"];
$postcode = $_POST ["postcode"];
$email = $_POST ["email"];
$pass = $_POST ["pass"];
$pass2 = $_POST ["pass2"];
//variables para comparar strings
$text="/^[a-zA-ZñÑáéíóúÁÉÍÓÚäëïöüÄËÏÖÜàèìòùÀÈÌÒÙ\s]+$/";
$cpspain="/^(0[1-9]|5[0-2]|[0-4][0-9])[0-9]{3}$/";
$validmail="/^[^0-9][a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*[@][a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*[.][a-zA-Z]{2,4}$/";
//funcion que comprueba los datos comparando con las variables de arriba
function checkname ($var, $var2){
$error =false;
if ( !preg_match($var, $var2) || strlen($var2) <= 2) {
$error=true;
}
return $error;
}
function checksurname ($var, $var2){
$error =false;
if ( !preg_match($var, $var2) || strlen($var2) <= 2) {
$error=true;
}
return $error;
}
function checkstate ($var){
if ($var=="none"){
$error=true;
}else{
$error=false;
}
return $error;
}
function checktown ($var, $var2){
$error =false;
if ( !preg_match($var, $var2) || strlen($var2) <= 2) {
$error=true;
}
return $error;
}
function checkpostcode ($var, $var2){
$error =false;
if ( !preg_match($var, $var2) || strlen($var2) != 5) {
$error=true;
}
return $error;
}
function checkemail($var, $var2){
$error =false;
if ( !preg_match($var, $var2)) {
$error=true;
}
return $error;
}
function checkpasslong($var){
$error =false;
if (strlen($var) <= 4) {
$error=true;
}
return $error;
}
function checkpassrepeat($var, $var2){
$error =false;
if ( $var != $var2) {
$error=true;
}
return $error;
}
$errorname = checkname ($text, $name);
$errorsurname = checksurname ($text, $surname);
$errorstate = checkstate ($provincia);
$errortown = checksurname ($text, $town);
$errorpostcode = checkpostcode ($cpspain, $postcode);
$errormail = checkemail ($validmail, $email);
$errorpasslong = checkpasslong ($pass);
$errorpassrepeat = checkpassrepeat ($pass, $pass2);
echo "formulario enviado";
}
?>
<form id="register" action="register.php" method="POST" name="adsearch">
<div class="register-top-grid">
<label for="name">Nombre*</label>
<input name="name" id="name" type="text" class="<?php if (isset($errorname) && $errorname==true) {echo "error";}?>" value="<?php if (isset($name)){echo $name;} ?>" />
<label for="surname">Apellido*</label>
<input name="surname" id="surname" type="text" class="<?php if (isset($errorsurname) && $errorsurname==true) {echo "error";}?>" value="<?php if (isset($surname)){echo $surname;} ?>" />
<label for="provincia">Provincia*</label><select name="provincia" id="provincia" class="<?php if (isset($errorstate) && $errorstate==true) {echo "error";}?>" >
<option value="Elegir Provincia" disabled selected="selected">Elegir Provincia</option>
<?php
$sql3= "SELECT * FROM gbv_state";
$res3=mysql_query ($sql3);
while ($row3 = mysql_fetch_array($res3)){
$p= $row3[id_prov];
echo "<option value='$p' ";
if (isset($provincia)){if($p==$provincia) {echo "selected";}}
echo ">";
echo "$row3[nombre]";
echo "</option>";
}; ?></select><br />
<label for="town"><?php $to=utf8_encode("Población");echo $to;?></label>
<input name="town" id="town" type="text" class="<?php if (isset($errortown) && $errortown==true) {echo "error";}?>" value="<?php if (isset($town)){echo $town;} ?>" />
<label for="postcode"><?php $cp=utf8_encode("Código Postal");echo $cp;?></label>
<input name="postcode" id="postcode" type="text" class="<?php if (isset($errorpostcode) && $errorpostcode==true) {echo "error";}?>" value="<?php if (isset($postcode)){echo $postcode;} ?>" />
<label for="email">Email</label><input name="email" id="email" type="text" class="<?php if (isset($errormail) && $errormail==true) {echo "error";}?>" value="<?php if (isset($email)){echo $email;} ?>" />
<label for="pass"><?php $pw=utf8_encode("Contraseña");echo $pw;?></label>
<input name="pass" id="pass" type="password" class="<?php if (isset($errorpasslong) && $errorpasslong==true) {echo "error";}?>" value="" />
<label for="repeat"><?php $rpw=utf8_encode("Repetir Contraseña");echo $rpw;?></label>
<input name="pass2" id="pass2" type="password" class="<?php if (isset($errorpassrepeat) && $errorpassrepeat==true) {echo "error";}?>" value="" />
<br><br>
<input type="submit" name="submit_reg" value="Registrarse" class="register" />
</form>
</div>
<div id="result2"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>
</div><!-- End Modal body -->
</div>
</div>
</div>