- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我的 xpage 应用程序中的 Bootstrap dateTimePicker 控件有问题,我怀疑这与 xPages 生成控件 ID 的方式有关。
以下代码在 inputText 元素上没有 id 时可以正常工作。
<script type="text/javascript" src="/fPath/jquery-min.js"></script>
<script type="text/javascript" src="/fPath/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/RfPath/bootstrap-datetimepicker-3.0.0/js/moment.min.js"></script>
<script type="text/javascript" src="/fPath/bootstrap-datetimepicker-3.0.0/js/bootstrap-datetimepicker.min.js"></script>
<div class='input-group date' data-datetimepicker="true">
<xp:inputText styleClass="form-control timePicker">
<xp:this.converter>
<xp:convertDateTime type="time" timeStyle="short" />
</xp:this.converter>
</xp:inputText>
<span class="input-group-addon">
<span class="glyphicon glyphicon-time"></span>
</span>
</div>
$('.timePicker').each(function(i,el){SHARED.timePickerOpen(el)})
SHARED = {
timePickerOpen: function(el){
$(el).datetimepicker({
pickDate: false,
pickTime: true,
useCurrent: true,
minuteStepping:5
});
}
}
最佳答案
有趣的插件。我创建了一个示例页面以查看是否可以将其与 XPage 集成以及是否遇到相同的错误。完成我在下面描述的操作后,我让它运行而没有您报告的问题。
如文档中所述,我添加了插件和 moment.js到数据库,并使用示例代码 here构建一个简单的演示页面。在数据库中,我使用 Bootstrap4XPages插件(3 月发布),因此 Bootstrap 3.1.1 已经加载。
<?xml version="1.0" encoding="UTF-8"?>
<xp:view
xmlns:xp="http://www.ibm.com/xsp/core"
xmlns:xc="http://www.ibm.com/xsp/custom">
<xp:this.resources>
<xp:script
src="momentjs-2.7.0/moment.min.js"
clientSide="true">
</xp:script>
<xp:script
src="eonasdan-datetimepicker/js/bootstrap-datetimepicker.min.js"
clientSide="true">
</xp:script>
<xp:styleSheet
href="eonasdan-datetimepicker/css/bootstrap-datetimepicker.min.css"></xp:styleSheet>
</xp:this.resources>
<xp:div
xp:key="facetMiddle">
<p>
This page uses 
<a
href="https://github.com/Eonasdan/bootstrap-datetimepicker">Eonasdan's Bootstrap DateTimePicker</a>
.
</p>
<div
class="col-sm-6">
<div
class="form-group">
<div
class='input-group date'
id='datetimepicker1'>
<xp:inputText
id="inputText1"
styleClass="form-control">
<xp:this.converter>
<xp:convertDateTime
type="both"
timeStyle="short" />
</xp:this.converter>
</xp:inputText>
<span
class="input-group-addon">
<span
class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</xp:div>
<xp:scriptBlock
id="scriptBlock1">
<xp:this.value><![CDATA[$(function () {
$('#datetimepicker1').datetimepicker();
});]]></xp:this.value>
</xp:scriptBlock>
</xp:view>
Uncaught TypeError: undefined is not a function
bootstrap-datetimepicker.js
,您需要找到确定它是否可以使用 AMD 加载器的行。它们大多位于 JavaScript 文件的开头或结尾。; (function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD is used - Register as an anonymous module.
define(['jquery', 'moment'], factory);
} else {
// AMD is not used - Attempt to fetch dependencies from scope.
if (!jQuery) {
throw 'bootstrap-datetimepicker requires jQuery to be loaded first';
} else if (!moment) {
throw 'bootstrap-datetimepicker requires moment.js to be loaded first';
} else {
factory(jQuery, moment);
}
}
}
; (function (factory) {
//if (typeof define === 'function' && define.amd) {
// AMD is used - Register as an anonymous module.
// define(['jquery', 'moment'], factory);
//} else {
// AMD is not used - Attempt to fetch dependencies from scope.
if (!jQuery) {
throw 'bootstrap-datetimepicker requires jQuery to be loaded first';
} else if (!moment) {
throw 'bootstrap-datetimepicker requires moment.js to be loaded first';
} else {
factory(jQuery, moment);
}
//}
}
关于twitter-bootstrap - xPages 中 bootstrap 3 的 Eonasdan datetimepicker,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24307884/
是否可以在 XDSoft DateTimePicker 中禁用所有指定的工作日,例如所有(且仅)星期日?如何做到这一点? 最佳答案 试试这个。 function disabledWeekdays(da
我正在尝试设置日期时间选择器 https://tempusdominus.github.io/bootstrap-3/并将其配置为内联使用。它初始化为: $('#datetimepicker5').d
在我的项目中,我需要使用格式为 HH:MM 的 Timepicker,但我使用它就像持续时间,而不是时间,所以有可能将 HH 增加到 99,而不是在 23 停止! 我使用此页面中的日期时间选择器:ht
$(function() { $('input.month-mode').datetimepicker({ viewMode: 'months', format
我正在使用 Bootstrap 日期时间选择器。我想要 datetimepicker 格式作为短月份名称,例如。 一月。我的代码在下面,它现在显示完整的月份名称为 January。如何让它成为 Jan
我有两个文本框:txtETCdatefrom 和 txtETCdateto 分别具有类 datetimepicker1 和 datetimepicker2: 我在两个类上都使用仅日期格式的日期时间
我目前正在使用 http://eonasdan.github.io/bootstrap-datetimepicker/ 如果我打开另一个日期时间选择器,我们如何关闭一个打开的日期时间选择器? 因为我有
我有一个 dateTimePicker。为了将这个 DateTimePicker 内容写入我的数据库,我得到了值: myDateTimePicker.selectedDate.value. 当用户手动
它可以正常工作,直到触发任何控件回发,但是当控件触发任何回发事件时,如果我们将“起始日期”更改为“截止日期”日期时间选择器,则它仅显示日期而不是日期和时间。当我更改“截止日期”与“起始日期”datet
我有一个包含多个日期时间选择器的 html 模板。如果我单击按钮打开一个日期时间选择器,然后单击另一个按钮打开新的日期时间选择器,则第一个保持不变(它不会关闭)。我希望一次只能打开一个日期时间选择器。
我正在尝试更新/更改日历 View 中突出显示的日期。但当日历显示时,它们不会在下一个事件中更新。 有工作中的 Plunker 片段: https://plnkr.co/edit/4HkCp5?p=p
我正在构建一个 MVC 5 应用程序,我正在尝试使用 Bootstrap.v3.Datetimepicker.CSS . 我有一个 Javascript 文件 $(document).ready( f
我基本上希望我的 Jquery:dateTimePicker 只允许 future 的日期——也就是说,如果当前日期时间是:2016 年 8 月 30 日,上午 10:20,那么我想选择一个大于 10
是否可以为 DateTimePicker 控件设置特定的文化?我想在飞蛾的格式名称和时间格式上使用这种特定的文化。例如,我创建了特定的文化: CultureInfo.GetCultureInfo("s
我正在尝试确定在 DateTimePicker (WinForms) 应用程序中选择(突出显示)了哪个控件(天、月、年)。是否有一个属性指示选择了哪个控件?如果是这样,我能否以编程方式仅更改另一个控件
UI 应该保持不变我不想这样做: dateTimePicker1.Format = DateTimePickerFormat.Custom; dateTimePicker1.CustomFormat
所以我使用 jQuery DateTimePicker,目前我有以下设置: jQuery(document).ready(function($) { jQuery.datetimepick
我正在为我的应用程序使用 ng-pick-datetime 选择器。我希望选定的时间在 24 小时内显示(15:00 而不是下午 3:00)。 When the picker opens the ti
我有一个使用日期选择器和验证器的字段。在下面的示例中,我已预先填写了日期输入。现在,删除数据,您将看到它不再有效。然后单击日历图标选择日期。在您离开输入(模糊)之前,它不会重新验证,但我宁愿它在从日期
我目前正在使用 Date time picker JQuery,但它没有使用给定的格式。它没有使用它,而是使用默认的日期格式,并在控制台中给出错误:Uncaught TypeError: F.mask
我是一名优秀的程序员,十分优秀!