动态更新bootstrap 3 datepicker选项？

伊万·华雷斯（Ivan Juarez）

此datepicker已使用其他默认选项创建，但我需要使用以下新选项对其进行更新，但它似乎不起作用：

// new options
var new_options = {
    format: 'dd/mm/yyyy',
    autoclose: true,
    language: 'es'
}

// update values
$("#fecha_periodo").datepicker("update", new_options );

我也想更新其他选项一样daysOfWeekDisabled，viewMode等等。

文森佐

不幸的是，没有API可以动态地更改选项，此处列出了所有可用的方法（您可以使用它setDaysOfWeekDisabled来设置动态地禁用星期几）。

您可以使用destroy方法销毁datepicker实例，并使用新选项再次构建它。

这是一个实时示例：

$('#datepicker').datepicker();

$('#btnChange').click(function(){
  var new_options = {
    format: 'dd/mm/yyyy',
    autoclose: true,
    language: 'es'
  }
  // Save value
  var value = $('#datepicker').datepicker('getDates');
  // Destroy previous datepicker
  $('#datepicker').datepicker('destroy');
  // Re-int with new options
  $('#datepicker').datepicker(new_options);
  // Set previous value
  $('#datepicker').datepicker('setDates', value);
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/locales/bootstrap-datepicker.es.min.js"></script>

<input type="text" class="form-control" id="datepicker">

<button id="btnChange" class="btn btn-primary">Change option</button>

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

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