Bootstrap DatePicker更改格式

玛丽莉

我将引导日期选择器与“禁用过去的日期和相关的禁用”配合使用。我正在按照单词的说明进行操作,但无法更改格式,原因是此内容可能丢失/不了解文档中的内容。如果有人可以给我解决方案,将不胜感激。

UI示例:

在此处输入图片说明

我的密码

$(document).ready(function() {
     //CHANGE DATE FORMAT
      format: "dd-mm-yyyy" //results in a syntax error    

    var nowTemp = new Date();
    var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

    var checkin = $('#dpd1').datepicker({
      onRender: function(date) {
        return date.valueOf() < now.valueOf() ? 'disabled' : '';
      }
    }).on('changeDate', function(ev) {
      if (ev.date.valueOf() > checkout.date.valueOf()) {
        var newDate = new Date(ev.date)
        newDate.setDate(newDate.getDate() + 1);
        checkout.setValue(newDate);
      }
      checkin.hide();
      $('#dpd2')[0].focus();
    }).data('datepicker');
    var checkout = $('#dpd2').datepicker({
      onRender: function(date) {
        return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
      }
    }).on('changeDate', function(ev) {
      checkout.hide();
    }).data('datepicker');
})

我在这里创建了一个JSFIDDLE。

德文·伯纳德(Devon Bernard)

您可以通过在输入字段中添加HTML属性来自定义日期选择器。参见示例:

<input type='text' name="pickupDate" id="dpd1" 
 class="form-control" data-date-format="dd-mm-yyyy" />

更新了JSFiddle

这个小提琴以您的自定义格式显示日期,并且它的值也可以以相同的格式进行访问。(例如$('#dpd2').val()

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Bootstrap Datepicker —如何也获得其他格式的toDisplay和其他格式的toValue

Bootstrap Datepicker防止日期格式更改+结束日期晚于开始日期

Bootstrap Datepicker格式显示的日期与值显示的日期不同

如何在更改时获取Bootstrap Datepicker的年份和月份

更改Angular ui-bootstrap datepicker日顺序

Angular Bootstrap Datepicker更改月份事件

Bootstrap Datepicker更改触发3次

更改Bootstrap Datepicker日期范围的可选范围

Bootstrap Datepicker格式无法更改为dd-mm-yyyy

ngx-bootstrap datepicker格式的全局配置

如何将Bootstrap Datepicker锚位置更改为中心?

vue.js bootstrap-datepicker的值未更改

更改Bootstrap Datepicker位置不起作用

ngx-bootstrap datepicker输出格式不是ISO格式

Bootstrap-DatePicker的自定义日期格式

减小大小并更改bootstrap-datepicker字段的文本颜色

如何更改Bootstrap Datepicker语言

Bootstrap Datepicker-在弹出窗口中更改星期几的缩写

在相同的输入文本中更改格式bootstrap-datepicker无效

Bootstrap的Datepicker:更新bootstrap-datepicker

Bootstrap Datepicker:格式更改为默认值

Bootstrap Angular Datepicker格式不起作用

Bootstrap DateTimePicker动态更改格式

Bootstrap 3 Datepicker + Moment.js似乎无法使用格式

无法更改Bootstrap DateTimePicker的格式

Bootstrap DatePicker 格式 mm/yyyy 设置最大月份

Bootstrap-datepicker 沙箱更改标签名称 - laravel

Bootstrap3 datepicker - 选择时更改日期

bootstrap-ui-datetime-picker 更改为 24 小时格式