Question

我不知道此问题的标题是否正确。

我有2个输入会触发启动日期选择器，一个输入用于日历，另一个输入时间。

<input type="text" class="form-control" placeholder="date" id="surveyDatepicker">                       
<input type="text" class="form-control" placeholder="time" id="surveyTimepicker">

Datetimepicker以这种方式启动

$('#surveyDatepicker').datetimepicker({
    showClose: true,
    format: 'L',
    icons: {
       close: 'closeText'
    },
    debug: true
});
$('#surveyTimepicker').datetimepicker({
    format: 'LT',
    debug: true,
    showClose: true,
    icons: {
       close: 'closeText'
    }
        });

我按照此帖子How to add close text to datetimepicker bootstrap?

的建议更改了默认值x

关闭按钮正确显示在日历容器正下方日历的底部。但是在时间容器中，关闭按钮显示在时间选择器上方的容器顶部。

如何在时间选择器下方的时间容器内移动关闭按钮？

Answer 1

我用CSS和flex解决了这个问题。

Havent检查它是否可以在所有浏览器中正常工作，但到目前为止，这是我能做到的最好的事情。

.bootstrap-datetimepicker-widget {
    ul {
        display: flex;
        flex-direction: column;
        li.picker-switch.accordion-toggle {
            order: 2;
        }
    }
}

定位自定义关闭按钮引导日期时间选择器

1 个答案: