jquery - jquery UI datetimepickerの「Now」ボタンを設定してUTC時間を設定するには?

Question

ここでは datetimepicker を使用しています。ブラウザごとに現在の現在ではなく、現在の時刻を UTC now に設定するように現在ボタンを設定するにはどうすればよいですか?

Answer 1

jQuery timepicker アドオン ファイルを開き、次の関数に移動します。

/*
* override "Today" button to also grab the time.
*/
$.datepicker._base_gotoToday = $.datepicker._gotoToday;
$.datepicker._gotoToday = function (id) {
    var inst = this._getInst($(id)[0]),
        $dp = inst.dpDiv;
    this._base_gotoToday(id);
    var tp_inst = this._get(inst, 'timepicker');
    selectLocalTimezone(tp_inst);
    var now = new Date();
    this._setTime(inst, now);
    $('.ui-datepicker-today', $dp).click();
};

以下の変更を追加するだけで、

var now = new Date();
var utcNow = new Date(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), now.getUTCHours(), now.getUTCMinutes(), now.getUTCSeconds());
this._setTime(inst, utcNow);

Answer 2

これは時間の設定には機能しましたが、カレンダーの実際の日付の設定にはあまり効果がありませんでした。

$.datepicker._gotoToday = function (id) {
    var inst = this._getInst($(id)[0]),
    $dp = inst.dpDiv;
    this._base_gotoToday(id);
    var tp_inst = this._get(inst, 'timepicker');
    var now = new Date();
    var now_utc = new Date(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), now.getUTCHours(), now.getUTCMinutes(), now.getUTCSeconds());
    this._setTime(inst, now_utc);
    $('.ui-datepicker-today', $dp).click();
};

Answer 3

同様の問題があり、最終的に「今」ボタンをカスタムボタンに置​​き換える必要がありました。私が知っているのは厄介ですが、それ以外の場合は、新しいバージョンごとにライブラリに触れる必要があるでしょう。

    window.date = "<?php echo $time; ?>";

    Date.prototype.addHours = function(h) {    
        this.setTime(this.getTime() + (h*60*60*1000)); 
        return this;   
    }
    var previous_time = new Date();
    previous_time.addHours(-1);
    var cur_time = new Date();
    $(".timepicker_from").datetimepicker({
        dateFormat: "mm/dd/yy",
        timeFormat: 'hh:mm:ss',
        showSecond: true,
        hour: previous_time.getUTCHours(),
        minute: previous_time.getUTCMinutes()
    });

    $('.timepicker_from').focus(function(){
        var timezone = jstz.determine();
        $('#timezone').val(timezone.name());
          $( ".ui-datepicker-current" ).replaceWith('<button type="button" style="float: left; margin: .5em .2em .4em; \n\
                                                                               cursor: pointer; padding: .2em .6em .3em .6em;\n\
                                                                               width:auto; overflow:visible;" onclick="set_utc_time_from(date);" > Now </button>' );
    });

    $( ".timepicker_to" ).datetimepicker({
        dateFormat: "mm/dd/yy",
        timeFormat: 'hh:mm:ss',
        showSecond: true,
        hour: cur_time.getUTCHours(),
        minute: cur_time.getUTCMinutes()
    });

    $('.timepicker_to').focus(function(){
        $( ".ui-datepicker-current" ).replaceWith('<button type="button" style="float: left; margin: .5em .2em .4em; \n\
                                                                               cursor: pointer; padding: .2em .6em .3em .6em;\n\
                                                                               width:auto; overflow:visible;" class="" onclick="set_utc_time_to(date);"> Now </button>' );
    });

    function set_utc_time_from(utc){
        var $from = $('input#cdr_from').val(utc);
    };

    function set_utc_time_to(utc){
        var $from = $('input#cdr_to').val(utc);
    };

Answer 4

このコードを見つけて置き換えます。今すぐボタンをクリックすると、現在の現地時間が表示されます。

/*
 * override "Today" button to also grab the time and set it to input field.
 */
$.datepicker._base_gotoToday = $.datepicker._gotoToday;
$.datepicker._gotoToday = function(id) {
    var inst = this._getInst($(id)[0]);
    this._base_gotoToday(id);
    var tp_inst = this._get(inst, 'timepicker');
    var tzoffset = $.timepicker.timezoneOffsetNumber(tp_inst.timezone);
    var now = new Date();
    var utcNow = new Date(now.getFullYear(), now.getMonth(), now.getDate(), now.getHours(), now.getMinutes(), now.getSeconds());
    this._setTime(inst, utcNow);
    tp_inst._onSelectHandler();
};