问题标签 [tempus-dominus-datetimepicker]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
779 浏览

bootstrap-4 - 检查 Bootstrap4 datetimepicker 的下拉菜单?

我正在尝试检查此 datetimepicker 下拉菜单中的元素。但是,每当我单击任何位置时,即使强制焦点状态,下拉菜单也会关闭。

我在 Mac 上并使用 Chrome。

在此先感谢您的帮助!

0 投票
1 回答
1573 浏览

twitter-bootstrap - 如何编辑源文件中未显示的 tempus-dominus (datetimepicker) 中的类?

例如,我想更改 tempus-dominus 的 .day 类(https://tempusdominus.github.io/bootstrap-4/),但即使使用 !important 在检查时它似乎也不起作用(尽量不要点击因为检查它很奇怪。即使强制 :hover 下拉菜单也会消失)。

假设我想将 .day 的字体大小从 90% 更改为 100%

源代码:https ://tempusdominus.github.io/bootstrap-4/theme/css/tempusdominus-bootstrap-4.css

找到下面的代码 =)

在此先感谢您的帮助!

0 投票
1 回答
990 浏览

jquery - tempusdominus - allowInputToggle 在 Bootstrap 4 项目中不起作用

我正在使用tempusdominus并试图让一个属性allowInputToggle工作:https ://tempusdominus.github.io/bootstrap-4/Options/#allowinputtoggle

这样做的目的是当用户点击进入一个<input>日历时应该打开。与必须单击日历图标的默认设置相反。

我正在使用 Bootstrap 4(和 FontAwesome Pro - 最新版本,用于我的图标)并具有以下标记:

我已经初始化 tempusdominus 如下:

当我单击日历图标时,我得到日历:

在此处输入图像描述

但是当我单击输入(例如#dateStart)时,我不会:

在此处输入图像描述

设置allowInputToggletrueon initialisation 的目的是使这项工作。那为什么不做呢?

没有控制台错误。

在浏览器中尝试过 Firefox 68.0.1 和 Chrome 76.0.3809.100。相同的行为。

使用: jquery 3.2.1、moment.js 2.24.0、Bootstrap 4.0.0、Tempus Dominus Bootstrap4 v5.0.0-alpha14

0 投票
0 回答
724 浏览

python - Django Tempus Dominus TimePicker 格式

当我使用 django-tempus-dominus TimePicker 小部件选择时间后提交表单时,我没有收到错误,但表单没有保存到数据库中,也没有显示在管理页面中。我收到一个视觉浏览器指示,表明我的 TimeFields 有问题。我可以从管理页面成功创建一个新表单,并且只在从我的表单页面提交时看到问题。我不确定这是否与我的 forms.py 中的 TimePicker 小部件的“格式”有关,是否与我的 settings.py 中的 TIME_INPUT_FORMATS 或其他问题有关。

如果我将 DateTimeField 与 DateTimePicker 小部件一起用于 start_time 和 end_time,并将小部件中的“格式”更改为“YYYY/MM/DD hh:mm: A”,而不是使用带有 TimePicker 小部件的 TimeField,则表单有效正确,提交后,可以从管理页面查看。

在我的 settings.py 中:

在我的models.py中:

在我的 forms.py 中:

在我的 tracker_form.html 中:

浏览器中视觉指示的屏幕截图:

https://imgur.com/a/S51qsAm

0 投票
2 回答
5761 浏览

javascript - 如何在 Tempus Dominus datetimepicker 中修复“未捕获的类型错误:无法读取未定义的属性‘格式’”?

我使用Tempus Dominus Bootstrap 4作为我的日期时间选择器。当用户在输入上输入无效值并聚焦(单击组件外部)时,它会得到Uncaught TypeError: Cannot read property 'format' of undefined.

在此处输入图像描述

但是,预期的行为是这样的:https ://i.imgur.com/MWgrBkB.mp4

如何修复错误?

我的演示

更新:没有为某人生成问题。这是产生问题的方式: https ://i.imgur.com/F0BpgZQ.mp4

0 投票
1 回答
361 浏览

javascript - 使用 Controller 中的结构初始化 TempusDominus datetimepicker

我有一个 tempusdominus datetimepicker 和一个链接选择。我从控制器中得到一个结构,该结构由 Map> 组成,其中键是应在 datetimepicker 中启用的日期,并且每个日期都有一个小时列表,当用户选择日期时,我必须在链接选择中显示这些小时。

我的jsp中有这个:

然后在我的javascript文件中,我有以下内容:

此 Ajax 调用结果类似于 {2019-09-12=[12:00 - 13:00, 14:30 - 15:00], 2019-09-13=[10:00 - 11:00]} .

但这不起作用,我得到一个带有日期和时间的 datetimepicker,但我在控制台上什么也没有……如果我拿出 ajax 调用,只是把 enabledDates: ["2019-09-12", "2019-09 -13"] 它可以工作,但如果我尝试从 ajax 调用中获取它们就不行了。

我对 ajax/jquery/javascript 非常没用,所以我确定我做错了什么......

0 投票
1 回答
316 浏览

datetimepicker - 如何在使用 bootstrap-datetimepicker 单击今天按钮后隐藏 datetimepicker

我在我的 Rails 应用程序中使用https://github.com/TrevorS/bootstrap3-datetimepicker-rails datetimepicker。单击今天按钮后,我们如何关闭小部件?

0 投票
3 回答
666 浏览

laravel - Datepicker JS 错误 tempus-dominus Laravel 5.8

试图实施datepicker。我正在使用tempus-dominus-bootstrap-4. 我已经使用npm命令安装了它,它已经在package.json. 遵循文档但我得到一个错误,我对javascript.

我得到以下错误:

主页:139 未捕获的 ReferenceError:$ 未定义

当我放在<script src="/js/app.js"></script>js 函数上方时,这是我得到的错误:

未捕获的类型错误:$(...).datetimepicker 不是函数

Blade.php,脚本在blade文件中。

脚本

0 投票
0 回答
286 浏览

javascript - Tempusdominus 更新事件未触发

我有一个 datetimepicker 来选择约会的日期,当我初始化 datepicker 时,我设置了当前月份的启用日期,并且我想捕获应该在用户单击下一个按钮时触发的更新事件(即更改月份)

这是 JSP 位:

还有js部分:

当我单击下一个按钮时,没有任何内容写入控制台...

我正在使用 Tempusdominus 5.0.1、Bootstrap、jQuery 3.4.1、moment 2.24.0 和 popper 1.14.3

0 投票
0 回答
2077 浏览

jquery - jQuery Datetimepicker Bootstrap 4 清除并检查空

在搜索了互联网和 StackOverflow,以及阅读了这个特定日期时间选择器的 3 或 4 个不同版本和迭代之后,我遇到了一些问题,这些问题阻碍了我完成这一套功能。

首先,我必须确认我正在使用的版本,这似乎不是 StackOverflow 上流行的版本。

https://tempusdominus.github.io/bootstrap-4/

我还实施了一些在未缩小的代码中建议的修复以更正清除按钮,这些修复在此处记录:

https://github.com/tempusdominus/bootstrap-4/issues/275 https://github.com/tempusdominus/bootstrap-4/issues/34

这些代码修复允许小部件按预期工作,除了两个主要功能。这是我需要做的事情:

  1. 从单击侦听器或 Bootstrap 模式关闭事件中,清除 datetimepicker。记录的 clear 方法不起作用。
  2. 查询 datetimepicker 的状态,确认是否为空或未设置。

这是HTML标记

这是实例。

});

这是我根据 BS 手风琴的关闭触发清除的地方:

我还检查实际值并将其转换为 ISO 日期,如果它检查为 NOT EMPTY,它永远不会显示为 NOT EMPTY。

这是我的空虚检查器(或实际上是几个):

并且这里是上面代码的控制台输出,其中日期从不为空。viewDate 总是返回一个值。