Datetimepicker：虽然小时数选择为高于当前小时，但无法选择小于当前分钟的分钟数

当我设置minDate为“2017/05/09 10:16:00”时，如果使用箭头设置小时数高于分钟数（例如：11小时），我可以设置小于分钟的分钟数（例如：10米）。但是，如果我通过使用从网格表中选择设置小时，我不能选择小于分钟的分钟。任何人都可以解决这个问题？请帮助我，对不起我的英语不好。 Datetimepicker：虽然小时数选择为高于当前小时，但无法选择小于当前分钟的分钟数

我的DateTimePicker设置：

$(".datepicker").datetimepicker({ 
    useCurrent: false, 
    format: "YYYY/MM/DD HH:mm ZZ", 
    locale: "ja", 
    sideBySide: true, 
    toolbarPlacement: "bottom", 
    showClose: true, 
    widgetPositioning:{ 
     horizontal: "auto", 
     vertical: "top" 
    }, 
    icons: { 
     close: "btn-info date-time-close-text" 
    } 
    });

浏览：

<div class="time-picker-wrapper"> 
    <div class="form-group"> 
    <%= f.text_field :public_time, class: "form-control datepicker time-public", 
     placeholder: t(".public_time"), readonly: notification.public_time.nil? && is_edit_page %> 
    <%= f.text_field :created_at, class: "datepicker hidden" %> 
    </div> 
    <button type="button" class="icon-time-picker-wrapper"> 
    <i class="mp-icon-time-picker"></i> 
    </button> 
</div>

来源

2017-05-09 Long Lý

您正在使用很多选项。我用datetimepicker取出了一个应用程序，它没有你所做的问题。我推荐的是从最基本的设置开始，并开始添加选项，直到问题开始，然后至少你知道哪个选项导致它。 –

我会试试看，谢谢你的建议！ –

我想我也看到一个问题。您有两个使用相同JavaScript函数的datetimepicker字段。尝试给他们不同的#ids并制作两个JavaScript函数。每个一个。他们可能会互相影响，给你意想不到的结果。 –

这是一个基本的设置，如果没有你提到的问题对我的作品。正如我在评论中所说，这有两个时间/日期字段 - 开始和结束。最后的minDate是开始日期，开始的最大日期是结束日期。看看这是否适合你。我要离开我的字段名称，以便您可以更改它们。

JavaScript文件：

$(document).on('turbolinks:load', function() { 
    $('#event_start').datetimepicker({ 
    format: 'YYYY-MM-DD hh:mm a' 
    }); 
    $('#event_end').datetimepicker({ 
    useCurrent: false, 
    format: 'YYYY-MM-DD hh:mm a' 
    }); 
    $('#event_start').on("dp.change", function (e) { 
    $('#event_end').data("DateTimePicker").minDate(e.date); 
    }); 
    $("#event_end").on("dp.change", function (e) { 
    $('#event_start').data("DateTimePicker").maxDate(e.date); 
    }); 
});

表单域

<div class="form-group"> 
    <%= f.label :start, 'Start Date-Time', class: 'control-label' %> 
    <div class='input-group date' id='event_start'> 
    <%= f.text_field :start, class: "form-control" %> 
    <span class="input-group-addon"> 
     <span class="glyphicon glyphicon-calendar"></span> 
    </span> 
    </div> 
</div> 
<div class='form-group'> 
    <%= f.label :end, 'End Time (Optional)', class: 'control-label' %> 
    <%= f.text_field :end, class: "form-control" %> 
</div>

来源

2017-05-09 05:00:03

我已经删除第二个text_field，但这个问题仍然发生。 –

我使用了相同的宝石，所以宝石的作品。也许从一个非常基本的设置开始。我会将我的答案改变为适合我的最基本的答案。你可以从这开始，看看它是否有效。 –

它仍然发生，你是否在你的datetimepicker中设置了minDate？我认为这是一个Datetimepicker错误。 –

我必须做勤劳一整天，终于找到我的问题的解决方案

$(document).ready(function(){ 
    var default_time = null; 

    $(".datepicker").datetimepicker({ 
    useCurrent: false, 
    format: "YYYY/MM/DD HH:mm ZZ", 
    locale: "ja", 
    sideBySide: true, 
    toolbarPlacement: "bottom", 
    showClose: true, 
    widgetPositioning:{ 
     horizontal: "auto", 
     vertical: "top" 
    }, 
    icons: { 
     close: "btn-info date-time-close-text" 
    } 
    }).on("dp.show", function(){ 
    default_time = moment(); 
    }); 

    $(".datepicker").on("dp.change", function(){ 
    var time_set = $(".datepicker").val(); 
    var date_time_set = new Date(time_set); 
    if (date_time_set.getHours() > default_time.hours()){ 
     $("td.minute.disabled").removeClass("disabled"); 
    } 
    else if (date_time_set.getDate() > default_time.date()){ 
     $("td.minute.disabled").removeClass("disabled"); 
     $("td.hour.disabled").removeClass("disabled"); 
    } 
    else if (date_time_set.getDate() == default_time.date()){ 
     $(".datepicker").data("DateTimePicker").minDate(moment()); 
    } 
    });

我希望这个答案c帮助某人，如果您对我的代码有任何反馈和评论，请告诉我。谢谢！

来源

2017-05-09 10:07:12

很酷，很高兴你把它修好了。 –

Datetimepicker：虽然小时数选择为高于当前小时，但无法选择小于当前分钟的分钟数

回答

相关问题