Mantis - 日期时间选择器答案

【问题标题】：Mantis - datetimepickerMantis - 日期时间选择器
【发布时间】：2017-11-02 14:10:50
【问题描述】：

我已经在 Mantis 论坛上发布了这个问题，但没有人回答我，所以我决定在这里问同样的问题。我被要求接受培训，以便对错误跟踪器 Mantis 进行一些开发。其中之一是防止用户选择今天之后的日期。如果看起来很简单，那么我发现的解决方案都没有为我工作。这是 Mantis 默认提供的输入：

<input tabindex="16" type="text" name="date_intervention" id="mydatetime" class="datetimepicker input-sm" data-picker-locale="fr-ca" data-picker-format="YYYY-MM-DD" size="16" data-date-end-date="0d" maxlength="20" value="2017-10-18">

这个版本的 Mantis 使用的是 3.3.6 Bootstrap 版本。以下是我尝试过但没有成功的解决方案：

通过 Javascript 使用 maxDate 属性

$(function() {$( "#mydatetime" ).datetimepicker({ maxDate: new Date });});

在我的输入中直接使用 data-date-start-date 和 data-date-end-date 属性

数据-日期-开始-日期=“0d” data-date-end-date="0d"

通过 Javascript 使用 endDate 属性

$(function() { $( "#mydatetime" ).datetimepicker({ endDate: +0d });});

我在这个论坛中找到了这些解决方案，但它对我不起作用。有没有人可以帮助我？提前致谢，

【问题讨论】：

你正在用 Id 初始化你的选择器，虽然我没有在你的代码上看到它，不应该是 $(".datepicker").datepicker({maxDate: '0'}); 或 datetimepicker 因为那是你的类“标识符”，其他的你的问题是关于 DateTimePicker 但你的插件似乎只是 DatePicker ;)
感谢您的回答。事实上，我对我的示例还不够清楚，但我已经尝试在我的代码中使用好的 id。我将对此进行编辑，以免造成进一步混淆。关于你的第二句话，我不得不承认我没有意识到有两个不同的插件。似乎引导程序正在使用“datetimepicker”，所以插件必须是 datetimepicker 而不是 datepicker 对吗？
这是您需要检查代码或使用浏览器检查工具并查看引用的代码是否为您提供选择器名称或页面链接的内容.
我已经验证过了，它似乎是 Mantis 中使用的 Boostrap datetimpicker。现在我不明白为什么应该工作的解决方案不适用于我......
抱歉，回答延迟。如果您使用 datepicker 它会创建另一个日历，我已经扣除了它的 Bootstrap 原因，这里有关于它的详细信息：eonasdan.github.io/bootstrap-datetimepicker

标签： bootstrap-datetimepicker eonasdan-datetimepicker mantis

【解决方案1】：

原因是你错误地使用了 eonasdan 的选项，为此你必须使用 maxDate 和 new Date()，就像你正在做的那样，或者使用 moment（应该包含在插件中） )

所以你的例子是这样的：

$("#mydatetime").datetimepicker({
  maxDate: moment().endOf('day') //This will set max day to choose today
});

还有一个活生生的例子：

$('#myDatepicker').datetimepicker({
	maxDate: moment().endOf('day')
});

<link href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/25c11d79/build/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>



<br/> <!--Space for the fiddle-->
<div class="container">
  <div class="row">
    <div class='col-sm-6'>
      <div class="form-group">
        <div class='input-group date' id='myDatepicker'>
          <input type='text' class="form-control" />
          <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
          </span>
        </div>
      </div>
    </div>
  </div>
</div>

如果您不想选择时间，只需设置您喜欢的 format 而不设置小时，例如：

format: 'DD/MM/YYYY'

【讨论】：

感谢您的详细回答，但不幸的是它仍然无法正常工作......没有任何反应，我仍然可以选择未来的日子。
会不会是它在您的控制台上抛出了一些错误？你能给我一些完整的例子（最好是链接），我可以在其中看到选择器的例子吗？
控制台中什么都没有。对于完整的示例，我不知道该怎么做。有什么我可以使用的工具吗？就像你对代码 sn-p 所做的那样？
你可以用JsFiddle设置，你的html，Js这里是一个例子 DatePicker已经设置好了jsfiddle.net/William_/20oywuno
感谢您的回归。我在这里放了一些其他代码：jsfiddle.net/5zfb6qr9我不知道它是否有帮助，它甚至无法显示日历。

【解决方案2】：

我的一位同事终于找到了解决方案，所以我在这里与您分享：

var today= new Date(); 
$('#myDateTime').data("DateTimePicker").maxDate(today);

这是我们找到解决方案的网站： https://eonasdan.github.io/bootstrap-datetimepicker/

再次感谢威廉抽出宝贵时间。

【讨论】：