所以我正在为Eclipse中的Design Studio制作一个自定义组件。我正在尝试创建一个引导日期选择器。所以我在我的项目中包含bootstrap(v4)和bootstrap-datepicker(css和js文件都参见代码)。现在问题是我每次加载页面并单击日历没有在我的屏幕上显示的日期选择器。奇怪的部分是,当我按f12检查我的错误:1)我没有显示错误2)当我按下f12后点击日期选择器它确实显示日历但它将完全被错误(日历显示和我可以选择日期,但它已经固定在空中浮动,即使我在日期选择器外面看到屏幕截图,也不会再关闭。
代码:
//scripts component d3 ckeditor my own css bootstrap.js(v4) bootrap-datepicker.js bootstrap.css bootstrap-datepicker3.css select2.css select2.js font-awsome
define(["sap/designstudio/sdk/component", "d3", "../js/ckeditor/ckeditor", "css!../css/component.css", "../js/bootstrap/js/bootstrap.min", "../js/bootstrap/js/bootstrap-datepicker.min", "css!../js/bootstrap/css/bootstrap.min.css", "css!../js/bootstrap/css/bootstrap-datepicker3.min.css", "css!../js/dist/css/select2.min.css", "../js/dist/js/select2.min", "css!../js/font-awesome/css/font-awesome.min.css"], function(Component, d3, ckeditor, css) {
Component.subclass("com.sap.sample.annotation.Annotation", function() {
//this stands in a function that gets called didn't wanne annoy you guys with 500 lines of code
dateYearMonth = theDiagram.append("foreignObject")
.attr("x", "5%")
.attr("y", "90%")
.attr("width", "200")
.attr("height", "50")
.append("xhtml:body")
//.style("font", "14px 'Helvetica Neue'")
.html('<div class="span5 col-md-5" id="sandbox-container"><input class="form-control" type="text"></div>');
//datepicker
$('#sandbox-container input').datepicker({
});
});
});
图像(请注意,按下f12后我点击输入后只会显示日历,否则它甚至不会显示):
任何人都有一些想法来解决这个问题,我全力以赴。
修改
我也看到每次点击日期选择器时,这会在代码中生成一个新的日期选择器,但它的显示为无;