首页 > 解决方案 > eonasdan bootstrap:无法使用小时箭头图标增加小时数

问题描述

我通过在项目中导入这个 JS 文件来使用Eonasdan datetimepicker 版本:4.17.47

此外,我正在使用一些自定义验证来确保当用户输入与预期不同的时间范围时显示红色文本。我没有设置minDatemaxDate因为时间范围是动态的并且可以更改。

但有时,用户无法通过单击向上箭头键来增加小时/分钟。datetimepicker设置为仅使用时间,因此初始化为:

$("#timePicker").datetimepicker({
        format: "LT",
        allowInputToggle: true,
        keepInvalid: true // the up arrow icon was not working, so I thought this will fix it but it didn't
      });

和模板:

<div class="form-group col-sm-6 time-block">
   <div class="control input-group customtextInput" id="timePicker">
      <input type="text" id="stime" name="time" class="inputText col-md-12 form-control time-picker"
         data-bind="event:{ blur: function (data, event) {$parent.handleDateTimeOnblur.bind(data, $parent, event)() } }"
         required />
      <span class="input-group-addon">
         ...
      </span>
   </div>
   <p class="text-danger login-error-msg time-empty" id="time-error" aria-label="Error Message"
      data-bind="text: $parent.timeErrorMessage()" role="alert"></p>
</div>

你可以在这里看到一个演示

我注意到,当用户尝试使用 datetimepicker 转到下一个日期时,它会停止递增,(此给定页面上的日期选择器未连接,它们是单独初始化的。)

对此的任何帮助将不胜感激!

标签: javascriptjqueryknockout.jsbootstrap-datetimepickereonasdan-datetimepicker

解决方案


这个问题我们现在解决了。参见GitHub 上的讨论


推荐阅读