web-dev-qa-db-ja.com

コンポーネントの日付/時刻ピッカー

カスタムコンポーネントで、日付と時刻を入力する必要があります。

Joomlaの標準カレンダー要素は日付ピッカーをサポートしていますが、時間ピッカーはサポートしていません。

誰かが私を助けて、別の日付と時刻の選択ツールを教えてもらえますか？

componentdevelopment
6
Piero Marsilio

@johanpwのソリューションの唯一の欠点は、＃datetimepicker2を使用することです。つまり、このフィールドタイプは1回しか使用できません。そうでなければ良い解決策！

代わりに、/ 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>';

'format: "yyyy-MM-dd hh:mm:ss"'も追加したので、必要に応じて、DateTime SQLフィールドを持つコンポーネント内で適切に使用できます。

日付を選択した後に入力ボックスが消えるという問題もありましたが、これは私である可能性がありますが、他の誰かがこれを経験した場合は、これを管理者のCSSに試してください：

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

Joomlaで 独自のカスタムフィールドタイプを作成 できます。この例はモジュール用ですが、同じプロセスがコンポーネントでも機能します。

このファイルを作成します：/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>';
    }
}

これで、カスタムフィールドタイプが作成されました。使用するには、これを.xmlファイル：

<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

（ http://tarruda.github.io/bootstrap-datetimepicker/ に基づく）

3
johanpw

Joomla 3.7以降、タイムピッカーはコアに含まれています。このドキュメントは here ですが、要点は次のとおりです。

これをXMLフォーム定義で行いたい場合は、

<?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"
        />
    />
/>

または、JHTMLを直接必要とする場合は、

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

これら2つの方法の重要なポイントは、「showtime」と形式です。形式にはいくつかの時間要素を含める必要があります%H、%M、%S、それ以外の場合は、時間ピッカーを取得しますが、選択した時間はサーバーに戻りません。

1
Dom

JHTML :: _（ 'behavior.modal'）;

echo JHTML :: calendar（ '2015-04-03'、 'name'、 'id'、 '％d。％m。％Y％H：％I'）;

0
Bender