Javascript Girl
  1. Javascript Girl
  3. Désactiver les dates dans pickadate-selecter et le rafraîchir
Intereting Posts
Javascript ne parvient pas à analyser un grand nombre dans JSON correctement Déclarant une variable protégée en javascript Javascript – Comment définir un Constructeur JavaScript: script en ligne avec un attribut SRC? En ce qui concerne la sécurité côté client, CORS fait-il autre chose que subvertir la même politique d'origine? Production de nombre aléatoire pondérée en Javascript Comment remplacer une fonction dans un autre fichier javascript? Ajouter des événements à de nouveaux nœuds Modification du bouton LMC qui copie dans le presse-papier JQuery: compter les éléments visibles – problèmes d'efficacité / vitesse Uncaught TypeError: Object.values ​​n'est pas une fonction JavaScript Validateur de champs requis dans sapui5 JQuery – Comment sélectionner l'élément de liste déroulante par texte? Jquery: comment utiliser la variable en tant que sélecteur Dans Javascript, est-il équivalent à .applicer qui ne change pas la valeur de ceci?

Désactiver les dates dans pickadate-selecter et le rafraîchir

J'essaie de désactiver certaines dates après avoir initialisé le Sélecteur de date .

Je lance le picker comme suit: 

$( document ).ready(function() { $('#inputDatetime').pickadate({ format: 'dd. mmmm yyyy', formatSubmit: 'yyyy-mm-dd', min: dt, selectYears: 2, selectMonths: true }); });

L'utilisateur effectue actuellement une action qui déclenche un événement onChange() . La fonction disableDates() prépare d'autres dates pour désactiver et le définit au sélecteur en utilisant la méthode set : 

 function disableDates() { var disabledDays = []; $.ajax({ url: 'partners/getInactiveDays', dataType: 'json', async: false, success: function(data) { $.each(data.days, function(i, d) { disabledDays.push(parseInt(d.Day.id)); }); } }); var $input = $('#inputDatetime').pickadate(); var picker = $input.pickadate('picker'); picker.set({ disable: disabledDays }); }

Veuillez noter que dans mon cas, disableDays contient des nombres entiers (en référence aux jours de la semaine) et les dates selon la documentation ( http://amsul.ca/pickadate.js/date/#disable-dates ).

Lorsque la fonction disableDates() est déclenchée pour la première fois, elle désactive correctement les dates que j'ai récupérées avec AJAX. Dès qu'il est déclenché une deuxième fois, le sélecteur ne semble plus être mis à jour. Je suppose que le sélecteur doit être rendu de nouveau pour refléter les changements. J'ai essayé de . stop() et .start() et .render() , sans aucun effet.

Comment puis-je désactiver les dates et actualiser le sélecteur correctement?

Je ne pouvais pas laisser aller ça, alors j'ai tout testé beaucoup. À la fin de la journée, ça marche comme il se doit. Il n'est pas nécessaire d' stop , de start ou de le render . Le problème doit être avec vos données json, ou les données en général (dates, ints).

J'ai créé deux exemples dans jsfiddle , démontrant qu'il fonctionne bien avec le type de données que vous semblez attendre.

Je vous conseille de consigner data.days , d.Day.id et finalement disabledDays pour consolider pour vérifier ce qu'ils contiennent réellement. Si rien d'autre, j'espère que vous pouvez avoir mes exemples de violon comme référence.

Une note sur le code. La première fois que vous initialisez le sélecteur, vous pouvez l'affecter à une variable: 

 var myvar = $('#inputDatetime').pickadate({ format: 'dd. mmmm yyyy', formatSubmit: 'yyyy-mm-dd', min: dt, selectYears: 2, selectMonths: true });

Et puis, lorsque vous devez obtenir cette instance, vous faites simplement: 

 var picker = myvar.pickadate('picker'); picker.set('disable', [1,7]); //disables all saturdays & sundays

Il n'est pas nécessaire de le réinitialiser en d'autres termes.

Aussi, une dernière note. Le réglage des dates de désactivation ne permet pas d'effacer les dates définies précédemment. Vous continuez à ajouter à la collecte des dates de handicap, et lorsque vous utilisez des jours, vous n'avez que 1-7 pour travailler avant que tout ne soit désactivé.

Effectuez vos modifications à partir des gestionnaires de réussite / erreur et essayez d'activer toutes les dates avant de désactiver: 

 function disableDates() { var disabledDays = []; var $input = $('#inputDatetime').pickadate(); var picker = $input.pickadate('picker'); $.ajax({ url: 'partners/getInactiveDays', dataType: 'json', async: false, success: function(data) { $.each(data.days, function(i, d) { disabledDays.push(parseInt(d.Day.id)); }); picker.set('enable', true); picker.set('disable', disabledDays); }, error: function() { picker.set('disable', true); } }); }

Êtes-vous sûr que votre demande ajax est appelée?

Certains navigateurs anciens, ennuyeux, obsolètes, non fonctionnels (oui, IE, je parle de vous) stockeront la requête ajax dans le cache et renverrons le premier résultat à chaque demande ultérieure. Comme vous n'avez pas marqué votre demande en tant que POST , il est possible que les partners/getInactiveDays ne soient appelés qu'une seule fois.

Ajoutez une method: 'POST' à votre demande, ou ajoutez une chaîne aléatoire (même la demande POST a parfois été stockée dans IE8) à votre url en tant que paramètre non utilisé (p. Ex. url:'partnets/getInactiveDays?randomizer='+new Date().getTime() ) pour empêcher le stockage du cache s'ils ne sont pas exécutés.