This blog describes how to add date pop-up calender to a custom form in the Drupal 7.
The use case is if you want to use date pop-up calendar in a custom form, then how you can do it in the drupal 7. Actually, the drupal 7 form API provides lots of form types like textfield, checkbox, checkboxes etc to create a custom form. Similarly, the date module also provides the form type called date_popup. We can use it in the custom form in order to display the date pop-up in the custom form.
Let consider the below code snippet:
function phponwebsites_menu() {
$items = array();
$items['customform'] = array(
'title' => t('Custom Form'),
'type' => MENU_CALLBACK,
'page callback' => 'drupal_get_form',
'page arguments' => array('phponwebsites_display_date_popup_form'),
'access callback' => TRUE,
);
return $items;
}
function phponwebsites_display_date_popup_form($form, &$form_state) {
$form['date'] = array(
'#type' => 'date_popup',
'#default_value' => date('Y-m-d'),
'#date_format' => 'Y-m-d',
'#date_year_range' => '0:+5',
'#datepicker_options' => array('minDate' => 0, 'maxDate' => 0),
);
return $form;
}
Where,
'#date_format' => 'Y-m-d' if you need to display only date
'#date_format' => 'Y-m-d H:i:s' if you need to display date & time
'#date_year_range' => '0:+5' if you need to display only future 5 years
'#datepicker_options' => array('minDate' => 0, 'maxDate' => 0) if you want to display only current date. We can hide the future & past dates using this option.
Please add the above code into your module file and look into the "customform" page. It looks like the below image:
Now I've hope you know how to add date pop-up calendar with custom form in the drupal 7.
The use case is if you want to use date pop-up calendar in a custom form, then how you can do it in the drupal 7. Actually, the drupal 7 form API provides lots of form types like textfield, checkbox, checkboxes etc to create a custom form. Similarly, the date module also provides the form type called date_popup. We can use it in the custom form in order to display the date pop-up in the custom form.
Use date pop-up calendar with the custom form in drupal 7:
Let consider the below code snippet:
function phponwebsites_menu() {
$items = array();
$items['customform'] = array(
'title' => t('Custom Form'),
'type' => MENU_CALLBACK,
'page callback' => 'drupal_get_form',
'page arguments' => array('phponwebsites_display_date_popup_form'),
'access callback' => TRUE,
);
return $items;
}
function phponwebsites_display_date_popup_form($form, &$form_state) {
$form['date'] = array(
'#type' => 'date_popup',
'#default_value' => date('Y-m-d'),
'#date_format' => 'Y-m-d',
'#date_year_range' => '0:+5',
'#datepicker_options' => array('minDate' => 0, 'maxDate' => 0),
);
return $form;
}
Where,
'#date_format' => 'Y-m-d' if you need to display only date
'#date_format' => 'Y-m-d H:i:s' if you need to display date & time
'#date_year_range' => '0:+5' if you need to display only future 5 years
'#datepicker_options' => array('minDate' => 0, 'maxDate' => 0) if you want to display only current date. We can hide the future & past dates using this option.
Please add the above code into your module file and look into the "customform" page. It looks like the below image:
Now I've hope you know how to add date pop-up calendar with custom form in the drupal 7.
Related articles:
Remove speical characters from URL alias using pathauto module in Drupal 7
Add new menu item into already created menu in Drupal 7
Add class into menu item in Drupal 7
Create menu tab programmatically in Drupal 7
Add custom fields to search api index in Drupal 7
Clear views cache when insert, update and delete a node in Drupal 7
Create a page without header and footer in Drupal 7
Login using both email and username in Drupal 7
Disable future dates in date pop-up calendar Drupal 7
Update multiple fields using #ajax in Drupal 7
Remove speical characters from URL alias using pathauto module in Drupal 7
Add new menu item into already created menu in Drupal 7
Add class into menu item in Drupal 7
Create menu tab programmatically in Drupal 7
Add custom fields to search api index in Drupal 7
Clear views cache when insert, update and delete a node in Drupal 7
Create a page without header and footer in Drupal 7
Login using both email and username in Drupal 7
Disable future dates in date pop-up calendar Drupal 7
Update multiple fields using #ajax in Drupal 7