如何设置Bootstrap Datepicker的第一天和第几天

时间:2012-08-27 14:02:04

标签: jquery asp.net twitter-bootstrap datepicker

我是新手:我正在玩Bootstrap Datepicker并且已经使用它了

$(document).ready(function () {
  $('#datepickeron').datepicker()
});

然后是

<div id="dateoickeron"></div>

但我不能在jQuery UI中设置第一天或第一周。通常情况下,我可以在jQuery UI中使用firstDay: 1, weekHeader: "Uge", showWeek: true,并显示3个月,例如numberOfMonths:[3,1],stepMonths:3。

如何为Bootstrap Datepicker执行此操作?

6 个答案:

答案 0 :(得分:37)

尝试添加weekStart。有关详细信息,请访问here

$(document).ready(function () {
 $('#datepickeron').datepicker({
   weekStart: 0 // day of the week start. 0 for Sunday - 6 for Saturday
 });
});

答案 1 :(得分:4)

一些例子。希望能帮助到你。像往常一样进入$(document).ready(function(){});

$('#fromDate').datepicker('setStartDate', '-15d');
$('#fromDate').datepicker('setEndDate', '1d');
$('#toDate').datepicker('setStartDate', '-15d');
$('#toDate').datepicker('setEndDate', '1d');


    // Initialize the dates
$('#cv-rpt-sdate').datepicker({format: 'dd-mm-yyyy',"autoclose": true});
$('#cv-rpt-edate').datepicker({format: 'dd-mm-yyyy',"autoclose": true});
$('#cv-rpt-sdate').datepicker('setEndDate', '1d');
$('#cv-rpt-edate').datepicker('setEndDate', '1d');

$('#dboard-att-date').datepicker({format: 'dd-mm-yyyy',"autoclose": true});
$('#dboard-att-date').datepicker('setStartDate', '-7d');
$('#dboard-att-date').datepicker('setEndDate', '1d');

答案 2 :(得分:1)

不需要jquery或javascript -

您可以在Tag中设置此属性。

property -   data-date-week-start   
type  -    integer  
default  -    0 
description - day of the week start. 0 for Sunday - 6 for Saturday

例如 - 我已经设置从星期一开始,然后是data-date-week-start =&#34; 1&#34;

<div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy" data-date-week-start="1">
  <input class="span2" size="16" type="text" value="12-02-2012">
  <span class="add-on"><i class="icon-th"></i></span>
</div>

答案 3 :(得分:1)

您必须导入 从'ngx-bootstrap / datepicker'导入{BsLocaleService}; 和 从'ngx-bootstrap / chronos'导入{defineLocale,enGbLocale};

在constoctor中,您必须添加defineLocale('en-gb',enGbLocale); 在ngOnit中,您必须添加this.localeService.use('en-gb');

它适用于Angular 7+的BS4

答案 4 :(得分:0)

您是否注意到“ id”元素中有错别字?将“ datepickeron”拼写错误为“ dateoickeron”。我谨此致歉,因为我不只是在评论中添加此内容,而且还没有获得这样做的许可。

<div id="dateoickeron"></div>

...应该是:

<div id="datepickeron"></div>

答案 5 :(得分:0)

Calendar.component.ts文件(适用于带有angular7的ngx-bootstrap datepicker -4)

步骤1 从'ngx-bootstrap / datepicker'导入{BsLocaleService}; 从'ngx-bootstrap / chronos'导入{defineLocale,enGbLocale};

步骤2 在构造函数中添加defineLocale('en-gb',enGbLocale); 第三步 //在ngOnit *中添加this.localeService.use('en-gb');