動態更新bootstrap 3 datepicker選項？

此日期選擇它已與其他默認選項創建的，但我需要有以下新的選項，以更新它，它似乎並沒有工作：動態更新bootstrap 3 datepicker選項？

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

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

我也想更新一樣daysOfWeekDisabled其他選項， viewMode等。

來源

2017-05-30 Ivan Juarez

自舉日期選擇器之內的更新區域，它似乎很清楚，選項指定更新值。 https://bootstrap-datepicker.readthedocs.io/en/latest/methods.html#update – Cam

我看到它已經改變了數值，但沒有改變 –

試試format選項。 https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#format – Cam

不幸的是，沒有API可以更改選項dinamically，所有可用的方法列出here（您可以使用setDaysOfWeekDisabled設置dinamically禁用星期幾天）。

您可以使用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>

來源

2017-05-30 15:46:26 VincenzoC

我正要換成日期選擇器「v4」，但它似乎並不是一個官方網站，我不知道你是否觀察到有很多bootstrap「datepickers」和「datetimepickers」網站讓人們感到困惑並且不知道使用哪一個，我只使用bootstraps built-int。我感謝您的回答，並會使用該問候。 –

不幸的是，bootstrap本身不包含日期選擇器，但有很多獨立的日期選擇器和引導主題。在我看來，最好的是eonasdan的[bootstrap-datetimepicker]（http://eonasdan.github.io/bootstrap-datetimepicker/）。它使用了momentjs，它有一個豐富的API，它有很好的文檔。 – VincenzoC

動態更新bootstrap 3 datepicker選項？

回答

相關問題