Resumo de IA
Gostaria de adicionar restrições de idade ao seletor de datas do seu formulário? Este guia mostrar-lhe-á como validar idades e exibir mensagens personalizadas quando as datas não cumprirem os seus requisitos. Demonstraremos isto utilizando um formulário de inscrição para uma aula de ballet infantil que aceita apenas crianças entre os 12 e os 18 anos.
Configurar o Seu Formulário
No primeiro passo, basta criar um novo formulário e adicionar um campo de formulário Data / Hora ao seu formulário.
Adicionar Validação de Restrição de Idade
Para validar idades e mostrar mensagens de erro abaixo do campo do formulário, adicione este código ao seu site. Se não tiver a certeza de como adicionar código personalizado, consulte o nosso guia sobre como adicionar trechos de código.
/**
* 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 );
Certifique-se de atualizar o ID do formulário (1000) e o ID do campo (25) para corresponderem ao seu próprio formulário. Se precisar de ajuda para encontrar estes IDs, consulte o nosso guia sobre como encontrar IDs de formulários e campos.
Com este trecho de código, se as datas falharem a restrição de idade, uma mensagem será exibida abaixo do campo quando o botão Enviar for clicado.
Utilizar Restrição de Idade com Campos Repetidores
Se o seu campo de data estiver dentro de um campo Repetidor, utilize esta versão modificada:
/**
* 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 );
Utilizar Comparação Exata de Datas
Para uma verificação de idade mais precisa, como garantir que os utilizadores têm exatamente 18 anos ou mais:
/**
* 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 é tudo! Implementou com sucesso a restrição de idade no seu formulário para o seu campo de seletor de datas. Em seguida, gostaria também de personalizar o campo de seletor de datas de outras formas? Consulte o nosso tutorial sobre personalização das opções do campo de data e hora para mais detalhes.