web-dev-qa-db-fra.com

Sélecteur de date / heure dans le composant

Dans mon composant personnalisé, je dois entrer la date et l'heure.

L'élément de calendrier standard de Joomla prend en charge un sélecteur de date, mais pas de sélecteur d'heure.

Quelqu'un peut-il m'aider et m'indiquer un autre sélecteur de date et d'heure?

componentdevelopment
6
Piero Marsilio

Le seul inconvénient de la solution de @ johanpw est d'utiliser # datetimepicker2, ce qui signifie que ce type de champ ne peut être utilisé qu'une seule fois. Bonne solution sinon!

Essayez plutôt ce qui suit dans votre /modules/mod_yourmodule/fields/datetime.php

$id = str_replace('jform[','',str_replace(']','',$this->name));

return '<div id="datetimepicker'.$id.'" class="input-append date">'.
                 '<input name="'.$this->name.'" data-format="MM/dd/yyyy HH:mm:ss PP" value="'.$this->value.'" type="text" />'.
                 '<span class="add-on">'.
                   '<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>'.
                 '</span>'.
                '</div>'.
                '<script type="text/javascript">'.
                  'jQuery(function() {'.
                    'jQuery("#datetimepicker'.$id.'").datetimepicker({'.
                      'language: "en",'.
                      'pick12HourFormat: true,'.
                      'format: "yyyy-MM-dd hh:mm:ss"'.
                    '});'.
                  '});'.
                '</script>';

J'ai aussi ajouté dans 'format: "yyyy-MM-dd hh:mm:ss"' afin que vous puissiez l'utiliser correctement dans un composant avec un champ DateTime SQL si vous le souhaitez.

J'ai également eu des problèmes où la zone de saisie disparaîtrait après la sélection d'une date, cela pourrait juste être moi, mais si quelqu'un d'autre éprouve ceci essaye ceci à votre administrateur CSS:

.input-append.date {
    display: inline-block!important;
}
4
VaciDesign

Vous pouvez créer vos propres types de champs personnalisés dans Joomla. Cet exemple concerne un module, mais le même processus fonctionne avec des composants:

Créez ce fichier: /modules/mod_yourmodule/fields/datetime.php

<?php
// Check to ensure this file is included in Joomla!
defined('_JEXEC') or die('Restricted access');

// Add CSS and JS
JHtml::stylesheet('http://netdna.bootstrapcdn.com/Twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css');
JHtml::stylesheet('http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css');
JHtml::script('http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js');

jimport('joomla.form.formfield');

class JFormFieldDateTime extends JFormField {

    protected $type = 'DateTime';

    public function getInput() {
            return '<div class="well">'.
                    '<div id="datetimepicker2" class="input-append">'.
                        '<input data-format="MM/dd/yyyy HH:mm:ss PP" type="text"></input>'.
                        '<span class="add-on">'.
                          '<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>'.
                        '</span>'.
                      '</div>'.
                    '</div>'.
                    '<script type="text/javascript">'.
                      'jQuery(function() {'.
                        'jQuery("#datetimepicker2").datetimepicker({'.
                          'language: "en",'.
                          'pick12HourFormat: true'.
                        '});'.
                      '});'.
                    '</script>';
    }
}

Vous avez maintenant un type de champ personnalisé. Pour l'utiliser, placez-le dans votre .xml fichier:

<fields name="params">
   <fieldset name="basic" addfieldpath="/modules/mod_yourmodule/models/fields">
       <field name="title" type="DateTime" label="Select Date and Time" description=""   />
   </fieldset>
</fields>

Joomla Custom Field type

(Basé sur http://tarruda.github.io/bootstrap-datetimepicker/ )

3
johanpw

Depuis Joomla 3.7, un sélecteur de temps est inclus dans le noyau. Les docs pour ceci sont ici , mais le Gist est comme suit.

Si vous souhaitez le faire via une définition de formulaire XML, utilisez

<?xml version="1.0" encoding="utf-8"?>
<form>
    <fieldset>
        <field
            name="mydatetimefield"
            type="calendar"
            label="COM_MYCOMPONENTNAME_FIELD_DATETIME"
            showtime="true"
            format="%Y-%m-%d %H:%M:%S"
        />
    />
/>

Ou si vous voulez JHTML directement, sa

JHtml::_(
'calendar',
'',
'mydatetimefield',
'mydatetimefieldid',
'%Y-%m-%d %H:%M',
[ 'showTime'=>'showTime' ]);

Les points clés de ces deux méthodes sont le "showtime" et le format. Le format doit inclure des éléments temporels %H, %M, %S, sinon vous obtiendrez un sélecteur d’heure, mais l’heure choisie ne sera pas renvoyée sur votre serveur.

1
Dom

JHTML :: _ ('behavior.modal');

echo JHTML :: calendar ('2015-04-03', 'nom', 'id', '% d.% m.% Y% H:% I');

0
Bender