Prova a impostare messaggio di convalida personalizzato con jQuery Remote

Question

ho la forma con la seguente configurazione di convalida:

$('#form').validate({ 
      onfocusout: false, 
      onkeyup: false, 
      onclick: false, 
      success: function(){ 
       $('#username').addClass('input-validation-confirmation'); 
      } 
     }); 
$('#username').rules("add", { 
     onfocusout: false, 
     onkeyup: false, 
     required: true, 
     email: true,      
     remote: { 
      url: function, 
      type: 'GET', 
      dataType: 'json', 
      traditional: true, 
      data: { 
       username: function() { 
        return $('#username').val(); 
       } 
      }, 
      dataFilter: function (responseString) { 
       var response = jQuery.parseJSON(responseString); 
       currentMessage = response.Message; 
       if (response.State == 0) { 
        currentMessage = currentMessage + 0; 
           return false; 
       } 
       return 'true'; 
      }, 
      beforeSend: function (response) { 
       showLoadingIndicator($('#username')); 
      }, 
      complete: function() { 
       hideLoadingIndicator($('#username')); 
      } 
     } 
}); 

Ciò sta tentando di fare è usare gli stessi elementi di validazione (per lavorare con qualche altro quadro) per mostrare sia errori che metodi di successo.

Il mio problema è che il metodo di successo della mia regola viene attivato PRIMA che la convalida remota sia stata completata. Ho provato a impostare il messaggio in diversi modi, ma il parametro dei messaggi personalizzati non sembra essere chiamato in caso di successo della convalida.

Qualcuno conosce altri metodi per utilizzare il campo di errore di convalida per entrambi i messaggi di errore e di successo quando si utilizza un mix di regole di convalida sia remote che di pattern?

Edit:

ora capisco che mi aspettavo un evento di successo al momento sbagliato. Ho bisogno di un evento che viene attivato una volta completata la convalida (non inviata). C'è qualche evento del genere?

Answer 1

Il codice ...

$('#username').rules("add", { 
    onfocusout: false, 
    onkeyup: false, 
    required: true, 
    email: true,      
    remote: { ... }, 
    messages: { ... }, 
    success: function (label) { ... } 
}); 

Il problema qui è che onfocusout, onkeyup e success non sono "regole". Solo le singole "regole" e l'opzione messages possono essere inserite all'interno del metodo .rules('add').

$('#username').rules("add", { 
    required: true, 
    email: true,      
    remote: { ... }, 
    messages: { 
     remote: "custom remote message" 
    } 
}); 

vedere la documentazione per .rules() metodo: http://jqueryvalidation.org/rules

onfocusout, onkeyup e success sono "opzioni" che vanno solo all'interno del metodo .validate(), che è attaccato solo all'elemento <form>.

Per quanto riguarda un messaggio "personalizzato" per remote: As per the docs, questo messaggio di errore sarà automaticamente il messaggio restituito dal server ... non è disponibile alcuna configurazione speciale.

---

EDIT come da commenti e OP aggiornamento:

tuo codice:

$('#form').validate({ 
     onfocusout: false, 
     onkeyup: false, 
     onclick: false, 
     success: function(){ 
      $('#username').addClass('input-validation-confirmation'); 
     } 
}); 

Lei ha affermato, "Ancora, con il codice di aggiornamento (vedi sopra) non vedo mai il successo evento."

Hai disabilitato tutti gli eventi su questo modulo. L'unico evento rimasto per l'attivazione della convalida in questo campo è quando si fa clic sul pulsante di invio. Esattamente quando aspettate di "vedere" success spegnere?

DEMO: http://jsfiddle.net/xMhvT/

In altre parole, submit è l'unico evento a sinistra per attivare un test di convalida quando hai disabili tutti gli altri eventi.

---

EDIT sulla base di un altro aggiornamento OP:.

"Ora capisco che mi aspettavo un evento di successo al momento sbagliato ho bisogno di un evento che viene generato una volta che la convalida è stata completata (non inviato) C'è qualche evento del genere? "

success non è un "evento". Un "evento" è una click, blur, keyup, ecc (onkeyup, onfocusout e onclick sono opzioni che controllano gli eventi per questo plugin)

success è una "funzione di callback". Una "funzione di callback" è ciò che succede su l'evento.

• Se è necessaria una "funzione di richiamata" che scatta ogni volta che un campo supera la convalida, è possibile utilizzare success.

• Se è necessaria una "funzione di richiamata" che si attiva quando il modulo supera la convalida, è possibile utilizzare submitHandler. Tuttavia, questo è anche quando il modulo è presentato.

• Se si desidera "verificare" l'intero modulo o un singolo campo per vedere se è valido senza inviare il modulo, è possibile utilizzare il "metodo" .valid().

$('#username').valid(); // for one field 

// or 

$('#form').valid(); // for the whole form 

// you can also... 

if ($('#form').valid()) { 
    //do something if form is valid 
} 

Questo metodo attiverà il test (mostra il messaggio) e restituirà un valore booleano.

DEMO: http://jsfiddle.net/xMhvT/1/

See: http://jqueryvalidation.org/valid/

Answer 2

sono in ritardo di rispondere a questa domanda, ma penso che potrebbe aiutare gli altri:

in PHP solo bisogno di aggiungere il seguente

if($rows_matched==1){ 
      echo (json_encode(false)); 
     } 
     else{ 
      echo (json_encode(true)); 
     } 

e nel codice js scrivere il seguente: $ (function() {

$('#product_add').validate({ 
rules:{ 
    product_sku:{ 
    remote:{ 
     url:'check.php', 
     type:'POST' 
    } 
    } 
}, 
messages:{ 
    product_sku:{ 
    remote:'already in database' 
    } 
} 
}); 

});

Answer 3

utilizzare i parametri remote, dataFilter e messages come questo:

var message = 'Default error message'; 

$('form').validate({ 
    rules: { 
     element1: { 
      remote: { 
       url: '/check', 
       type: 'post', 
       cache: false, 
       dataType: 'json', 
       data: { 
        element2: function() { 
         return $('.element2').val(); 
        } 
       }, 
       dataFilter: function(response) { 
        response = $.parseJSON(response); 

        if (response.status === 'success') return true; 
        else { 
         message = response.error.message; 
         return false; 
        } 
       } 
      } 
     } 
    }, 
    messages: { 
     element1: { 
      remote: function(){ return message; } 
     } 
    } 
});