2017-08-12 1 views
0

Je voudrais que l'utilisateur sélectionne une date à partir d'un composant bootstrap datepicker et stocke la valeur sélectionnée dans le stockage local. Lorsque l'utilisateur a terminé sa sélection, il peut sélectionner le bouton sur lequel un appel ajax utilisera le stockage local. À ce stade, j'ai du mal à obtenir le composant datepicker pour définir une valeur dans le stockage local. Le composant sélecteur de date s'affiche lorsque l'utilisateur sélectionne est et la sélection de l'utilisateur devient la valeur du champ de saisie.bootstrap datepicker et stockage local

Voici la marque vers le haut:

<form> 
    <div class="form-group"> 
     <label for="edge-name" class"control-label">Start:</label> 
     <input type="text" class="form-control" id="filterStart"> 
    </div> 
</form> 

Et le javascript

$(document).ready(function(){ 
    $('#filterStart').datepicker(); 
    $('#filterStart').on('changeDate' function(){ 
     var newValue = $('#filterStart').datepicker('getFormattedDate') 
     localStorage.setItem('filterStart',newValue); 
     }); 

J'ai inséré console.log dans divers endroits à travers le javascript mais le code écrit jamais à la console donc je sachez que ce n'est pas écrit dans le stockage local. Je sais que le stockage local fonctionne parce que je l'utilise d'autres parties du code.

Aussi, toutes les suggestions sur la façon de faire mieux seraient grandement appréciées.

Répondre

1

Si vous utilisez ce bootstrap-datepicker vous pouvez jeter un oeil à la jsfiddle suivante:

$('#filterStart').datepicker(); 
$('#filterStart').on('changeDate', function (e) { 
    var newValue = $('#filterStart').datepicker('getFormattedDate') 
    localStorage.setItem('filterStart', newValue); 
}); 
$('#btn').on('click', function(e) { 
    $('#logMsg').val('Value saved in local storage is: ' + 
    localStorage.getItem('filterStart')); 
}) 
+1

Ceci est la réponse que je, mais la racine cause de mon code ne fonctionnait pas était que j'ai oublié d'inclure ce qui suit dans mon code HTML: https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.js – ForgottenKahz

1

Je ne peux pas trouver si la méthode 'getFormattedDate' existe mais il existe une méthode standard getDate pour cela. En passant, vous manquez un point-virgule dans la ligne de définition de newValue;

0

Je pense que vous instanciez une nouvelle datepicker dans votre événement changeDate. Vous pouvez essayer d'obtenir la date formatée du .data:

var newValue = $('#filterStart').data('datepicker').getFormattedDate('yyyy-mm-dd');