La convalida del modulo è uno degli aspetti più importanti su qualsiasi applicazione web. Più il Modulo è sicuro più allo stesso tempo sarà sicura l’applicazione.
La validazione di un modulo mediante jQuery è davvero semplice e mediante questo plugin può essere anche molto personalizzabile.

Funzionamento

Semplice, in questo plugin dobbiamo impostare tre parametri per ogni classe richiesta. L’utente può impostare la propria classe e definire la regola. Inoltre, l’utente può anche impostare gli eventi OnError e OnValid con una particolare classe dando così all’utente un’altra possibilità di personalizzazione, permettendo di aggiungere effetti anche animati grazie a jQuery().
Qui di seguito il codice javascript utilizzato per l’esempio:

$( function() {
$( '#create-post-form' ).ipValidate( {

required : { //required is a class
rule : function() {
return $( this ).val() == '' ? false : true;
},
onError : function() {
if( !$( this ).parent().hasClass( 'element_container' ) ) {
$( this ).wrap( '

' ).after( '<span>' + $( this ).attr( 'rel' ) + '</span>' );
} else if( !$( this ).parent().hasClass( 'error_div' ) ) {
$( this ).next().text( $( this ).attr( 'rel' ) ).parent().addClass( 'error_div' );
}
},
onValid : function() {
$( this ).next().text( '' ).parent().removeClass( 'error_div' );
$(this).focus();
}
},

nonzero : { //nonzero is a class

rule : function() {
return $( this ).val() == 0 ? false : true;
},
onError : function() {
$( this ).css( 'border', '4px solid #C00' );
},
onValid : function() {
$( this ).css( 'border', '4px solid #09F' );
}
},

postOptions : {  //postOptions is a class

rule : function() {
return $( 'input[type=checkbox]:checked' ).length &lt; 1 ? false : true;
},
onError : function() {
$( '.chk_div', this ).css( 'border', '4px solid #C00' );
},
onValid : function() {
$( '.chk_div', this ).css( 'border', '4px solid #09F' );
}
},

submitHandler : function() {
alert( 'Il Modulo è pronto per essere inviato.' );
return false;
}
});
});

Requisiti: jQuery
Demo: http://www.web-developers.it/demo/simple-form-validation-jquery.html
Download:   jquery-validate.zip (800 bytes, 901 hits)