Riassunto AI
Vuoi aggiungere restrizioni di età al selettore di date del tuo modulo? Questa guida ti mostrerà come convalidare le età e visualizzare messaggi personalizzati quando le date non soddisfano i tuoi requisiti. Lo dimostreremo utilizzando un modulo di registrazione per corsi di balletto per bambini che accetta solo bambini di età compresa tra 12 e 18 anni.
Configurazione del tuo modulo
Nel primo passaggio, crea semplicemente un nuovo modulo e aggiungi un campo modulo Data / Ora al tuo modulo.
Aggiunta della convalida della restrizione di età
Per convalidare le età e mostrare messaggi di errore sotto il campo del modulo, aggiungi questo codice al tuo sito. Se non sei sicuro di come aggiungere codice personalizzato, consulta la nostra guida su come aggiungere snippet di codice.
/**
* Display an error message on submission of the form if the date doesn't fall within the guidelines.
*
* @link https://wpforms.com/developers/how-to-provide-an-age-restriction-on-the-datepicker-form-field/ *
*/
function wpf_dev_process( $fields, $entry, $form_data ) {
// Optional, you can limit to specific forms. Below, we restrict output to
// form #1000.
if ( absint( $form_data[ 'id' ] ) !== 1000 ) {
return $fields;
}
if ( isset( $fields[25][ 'value' ] ) && !empty( $fields[25][ 'value' ] ) ) {
$timestamp = strtotime( $fields[25][ 'value' ] );
if ($timestamp === false) {
// Invalid date format
wpforms()->process->errors[ $form_data[ 'id' ] ][ '25' ] = esc_html__( 'Invalid date format', 'plugin-domain' );
} else {
$birth_year = date('Y', $timestamp);
$current_year = date('Y');
$age = $current_year - $birth_year;
if ($age < 12 || $age > 18) {
// Show an error message at the top of the form and under the specific field
wpforms()->process->errors[ $form_data[ 'id' ] ][ '25' ] = esc_html__( 'Minimum age requirement is 12 and maximum age requirement is 18', 'plugin-domain' );
}
}
} else {
// Date field is empty
wpforms()->process->errors[ $form_data[ 'id' ] ][ '25' ] = esc_html__( 'Date field is required', 'plugin-domain' );
}
return $fields;
}
add_action( 'wpforms_process', 'wpf_dev_process', 10, 3 );
Assicurati di aggiornare l'ID modulo (1000) e l'ID campo (25) per corrispondere al tuo modulo. Se hai bisogno di aiuto per trovare questi ID, consulta la nostra guida per trovare ID di moduli e campi.
Con questo snippet di codice, se le date non superano la restrizione di età, verrà visualizzato un messaggio sotto il campo quando viene fatto clic sul pulsante Invia.
Utilizzo della restrizione di età con campi ripetitori
Se il tuo campo data si trova all'interno di un campo Ripetitore, utilizza questa versione modificata:
/**
* Age restriction validation for Repeater fields
*/
function wpf_dev_process( $fields, $entry, $form_data ) {
if ( absint( $form_data[ 'id' ] ) !== 1000 ) {
return $fields;
}
foreach ( $fields as $field_id => $field ) {
if ( preg_match( '/^25(_\d+)?$/', $field_id ) ) {
if ( isset( $field[ 'value' ] ) && !empty( $field[ 'value' ] ) ) {
$timestamp = strtotime( $field[ 'value' ] );
if ( $timestamp === false ) {
wpforms()->process->errors[ $form_data[ 'id' ] ][ $field_id ] = esc_html__( 'Invalid date format', 'plugin-domain' );
} else {
$birth_year = date('Y', $timestamp);
$current_year = date('Y');
$age = $current_year - $birth_year;
if ( $age < 12 || $age > 18 ) {
wpforms()->process->errors[ $form_data[ 'id' ] ][ $field_id ] = esc_html__( 'Minimum age requirement is 12 and maximum age requirement is 18', 'plugin-domain' );
}
}
}
}
}
return $fields;
}
add_action( 'wpforms_process', 'wpf_dev_process', 10, 3 );
Utilizzo del confronto esatto della data
Per una verifica dell'età più precisa, come assicurarsi che gli utenti abbiano esattamente 18 anni o più:
/**
* Check if the user is 18 years or older using exact date comparison
*/
function wpf_dev_compare_dates( $fields, $entry, $form_data ) {
if ( absint( $form_data[ 'id' ] ) !== 1000 ) {
return $fields;
}
$age = 18;
$date_1 = $fields[25][ 'unix' ];
if( is_string( $date_1 ) ) {
$date_1 = strtotime( $date_1 );
}
if( time() - $date_1 < $age * 31536000 )
wpforms()->process->errors[ $form_data[ 'id' ] ][ 'header' ] = esc_html__( 'Apologies, you need to be 18 or older to submit this form.', 'plugin-domain' );
}
add_action( 'wpforms_process', 'wpf_dev_compare_dates', 10, 3 );
E questo è tutto! Hai implementato con successo la restrizione di età sul tuo modulo per il campo del selettore di date. Successivamente, vuoi personalizzare ulteriormente il campo del selettore di date? Dai un'occhiata al nostro tutorial su come personalizzare le opzioni del campo data e ora per maggiori dettagli.