TYPO3: Datumsfeld für BE Modul

Datepicker für ein Input-Feld in einem BE-Modul (hier in einem BE Modul umgesetzt mit Extbase/Fluid, getestet unter TYPO3 6.2):

$doc = \TYPO3\CMS\Core\Utility\GeneralUtility::makeInstance('TYPO3\\CMS\\Backend\\Template\\DocumentTemplate');
$pageRenderer = $doc->getPageRenderer();
// Load ExtJS
$pageRenderer->loadExtJS();
$pageRenderer->addJsFile($this->backPath . 'sysext/backend/Resources/Public/JavaScript/tceforms.js');
$pageRenderer->addJsFile($this->backPath . 'js/extjs/ux/Ext.ux.DateTimePicker.js');
// Define settings for date picker
$typo3Settings = array(
    'datePickerUSmode' => $GLOBALS['TYPO3_CONF_VARS']['SYS']['USdateFormat'] ? 1 : 0,
    'dateFormat' => array('j-n-Y', 'G:i j-n-Y'),
    'dateFormatUS' => array('n-j-Y', 'G:i n-j-Y')
);
$pageRenderer->addInlineSettingArray('', $typo3Settings);
 
$icon = \TYPO3\CMS\Backend\Utility\IconUtility::getSpriteIcon('actions-edit-pick-date', array(
    'style' => 'cursor:pointer;',
    'id' => 'picker-tceforms-datefield-start'
));
$this->view->assign('icon', $icon);

Und das Template:

<f:form.textfield name="start" id="tceforms-datefield-start" value="" /> <f:format.raw>{icon}</f:format.raw>

Die Benennung der ID ist wichtig, diese muss in der Form tceforms-datefield-[fieldname] sein. Statt „datefield“ kann man auch „datetimefield“ verwenden, dann enthält der Datepicker noch die Uhrzeit.

datepickerDie System-Extension scheduler setzt einen solchen Datepicker in dem Backend-Modul für die Task-Planung ein (siehe Abbildung), ebenso die Extension formhandler und weitere.

Autor:
Geändert: Donnerstag, 21. Mai 2015 12:43 Uhr
Erstellt: Freitag, 14. Februar 2014 9:25 Uhr
Tags: , , , , , , , , ,
Themengebiet: Web Entwicklung, TYPO3, TYPO3 Extension-Programmierung

Trackback: Trackback-URL LoadingZu Favoriten hinzufügen

2 Kommentare

  1. 1

    Danke für den Beitrag! Ich habe das mal für 6.2 abgewandelt.

    use TYPO3\CMS\Core\Utility\ExtensionManagementUtility;
    ...
    $pageRenderer->addJsFile(ExtensionManagementUtility::extRelPath('scheduler') . 'res/tx_scheduler_be.js');
    $pageRenderer->addJsFile($this->backPath . 'sysext/backend/Resources/Public/JavaScript/tceforms.js');
    $pageRenderer->addJsFile($this->backPath . 'js/extjs/ux/Ext.ux.DateTimePicker.js');

  2. 2

    Hi Susanna, danke für deine Info. Ich habe das mit TYPO3 6.2 getestet und im Beitrag oben ergänzt.

Kommentar abgeben