Bootstrap 3 Datepicker Optionen dynamisch aktualisieren?

Question

Dieses picker es ist bereits mit anderen Standardoptionen erstellt, aber ich brauche es mit den folgenden neuen Optionen zu aktualisieren und es scheint nicht zu funktionieren:

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

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

Ich würde auch andere Optionen wie daysOfWeekDisabled aktualisieren möchte, viewMode und so weiter.

Answer 1

Leider gibt es keine API, um Optionen dynamisch zu ändern, alle verfügbaren Methoden sind aufgelistet here (Sie können setDaysOfWeekDisabled verwenden, um dynamisch Wochentage deaktiviert zu setzen).

Sie können die Methode destroy verwenden, um die Datepicker-Instanz zu zerstören und sie mit den neuen Optionen erneut zu erstellen.

Hier ein anschauliches Beispiel:

$('#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>