problema ajax submit form

**Brt** · 23-05-2012, 09:27

ciao a tutti, ho un problema che mi affigge da diversi giorni e non riesco a venirne a capo, alla fine ho deciso di affidarmi a voi..

Devo fare un controllo con ajax per verificare che l'email inserita non sia ancora presente nel database.
Se c'è già mi mette l'input text in rosso e non mi invia il form.

Il controllo lo faccio sia quando esco dall'input, sia quando invio il form.
Quando esco dall'input mi fa il controllo ed è tutto ok, quando invio il form mi fa il controllo, ma rimane sempre sulla stessa pagina.
Non so se mi sono spiegato bene, cmq vi allego i miei file:

codice:

<?session_start();
include 'database.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
  <head>
    <script type="text/javascript">
    $(document).ready(function(){
	//global vars
	var form = $("#customForm");
  var email = $("#email");
	var emailError = $("#emailError");

	//On blur
  email.blur(validaAjaxEmail);
  email.blur(validaEmail);

	//On Submitting
	form.submit(function(){
    if(validaEmail() & validaAjaxEmail())
      return true;
  	else
  		return false;
	});

	//validation functions
  function validaAjaxEmail(){
    $.ajax({
      url: 'AJAXvalidate.php',
      type: "POST",
      data: "email="+email.val(),
      success: function(data) {
        //if it's NOT valid
        if(data=="error"){
          email.addClass("error");
          emailError.html("E-mail gi&agrave; presente");
    			emailError.addClass("error");
    			return false;
        }
        //if it's valid
        else{
          return true;
        }
      }
    });
  }
	function validaEmail(){
		//testing regular expression
		var a = $("#email").val();
		var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
		//if it's valid email
		if(filter.test(a)){
			email.removeClass("error");
			emailError.text("");
			emailError.removeClass("error");
			return true;
		}
		//if it's NOT valid
		else{
			email.addClass("error");
			emailError.text("Inserisci un'email valida");
			emailError.addClass("error");
			return false;
		}
	}
});
</script>
  </head>
  <body>
    <div id="container">
      <div id="destra">
          <form method="get" id="customForm" class="customForm" action="pagina.php">

    				<label for="email">E-mail<span class="red">*</span><span id="emailError"></span></label>
    				<input id="email" name="email" type="text" class="registra" value="" />

            <input class="submit" type="submit" value="Salva le modifiche" />
          </form>
      </div>
    </div>
  </body>
</html>

e il file per il controllo richiamato da ajax

codice:

<?session_start();
include 'database.php';
/**
 * funzione per verificare se l'email esiste gia'
 */
function isset_email($email) //non conto l'email attuale dell'utente
{
	$email = trim($email);
	$query = "SELECT COUNT(*) AS conta FROM utenti WHERE email='".addslashes(utf8_decode($email))."'";
	$result = mysql_query($query) or die(mysql_error());
	$row = mysql_fetch_array($result);
	if($row['conta']>=1)
  {
		return TRUE; // true se utente esiste
	}
	else
  {
		return FALSE;
	}
}

/**
 * PROCESSIAMO LA RICHIESTA AJAX
 */
if(isset($_POST['email'])) //viene da pagina modifica dati personali
{
  if(!isset_email($_POST['email']))
  {
  	echo 'ok';
  }
  else
  {
  	echo 'error';
  }
}
?>

Se sapete aiutarmi ve ne sarei molto grato

**Vindav** · 23-05-2012, 10:24

if(validaEmail() && validaAjaxEmail())

**Brt** · 23-05-2012, 10:37

non è questo il problma, ho modificato ma non cambia niente e il problema me lo da anche con if(validaAjaxEmail())

**Vindav** · 23-05-2012, 10:48

è uno dei problemi, ce ne saranno altri, questo non toglie che quello è un errore l'operatore logico AND va scritto con 2 &

Controlla la console js e vedi se ci sono errori, verifica anche che la chiamata ajax vada a buon fine, puoi utilizzare firebug

**Brt** · 23-05-2012, 11:05

utilizzo strumenti er gli sviluppatori di google chrome, ce fa la stessa cosa di firefox.
cmq la console non da nessun errore e la chiamata ajax è giusta, quando clicco sul submit del form mi restituisce error o ok in base all'email se è presente o meno.
Non so proprio dove sia il problema

**Vindav** · 23-05-2012, 11:41

codice:

function validaAjaxEmail(){
var esito= false;
    $.ajax({
      url: 'AJAXvalidate.php',
      type: "POST",
      data: "email="+email.val(),
      success: function(data) {
        //if it's NOT valid
        if(data=="error"){
          email.addClass("error");
          emailError.html("E-mail già presente");
    			emailError.addClass("error");
    			        }
        //if it's valid
        else{
          esito = true;
                  }
      }
    });
return esito;
  }

**Brt** · 23-05-2012, 11:54

niente da fare, non riesco a capire dove sia il problema

Altrimenti non avete voi qualcosa (di funzionante

) da propormi?

**carlomarx** · 23-05-2012, 12:07

Quando fai un controllo asincrono sul submit, non ha senso che usi return true/false sull'onsubmit, l'ascincronia ti sballa tutto. Devi settare un bel return false fisso sull'onsubmit del form e quando tutti i controllo sono stati completati, lanciare manualmente un tuoform.submit() dalla funzione di callback di ajax (che eseguirà anche TUTTI gli altri controlli, anche quelli che non hanno a che fare col tuo database).

**Vindav** · 23-05-2012, 12:10

codice:

$(".submit").click(function(e){
    if(validaEmail()){
    	$.ajax({
    	      url: 'AJAXvalidate.php',
    	      type: "POST",
    	      data: "email="+email.val(),
    	      success: function(data) {
    	        //if it's NOT valid
    	        if(data=="error"){
    	          email.addClass("error");
    	          emailError.html("E-mail già presente");
    	    			emailError.addClass("error");
    	    			
    	    			
    	        }
    	        else{
					form.submit();
        	        }
    	    });
}
	});

**Brt** · 22-06-2012, 12:39

non ho più avuto tempo di guardarlo, ma questa mattina mi sono messo lì ed ho provato i vostri consigni, adesso funziona perfettamente

grazie mille!!!
ecco come ho risolto:

codice:

//On Submitting
  $("#invia_form").click(function(e){
    $.ajax({
      url: 'AJAXvalidate.php',
      type: "POST",
      data: "email2="+email.val(),
      success: function(data)
      {
        //if it's NOT valid
        if(data=="error")
        {
          email.addClass("error");
          emailError.html("E-mail gi&agrave; presente");
          emailError.addClass("error");
        }
        else
        {
          if(validaEmail())
          {
            invia_form=1;
            form.submit();
          }
        }
      }
    });
  });

 form.submit(function(){
    if(invia_form==1)
      return true;
  	else
  		return false;
	});

Discussione: problema ajax submit form

Strumenti discussione

Ricerca discussione

Visualizza

problema ajax submit form

Permessi di invio