0

I have just started using jQuery UI's datepicker and I am looking for a way to enable dates that are only in the data array... I tried everything but it doesn't seem to disable any dates. I checked data array and it display everything in the following format if I use console.log(data):

["2017-04-28", "2017-05-19", "2017-04-03", "2017-04-05", "2017-04-07", "2017-04-04", "2017-04-12"]

$.ajax({
    url: '/getDoctorsAppointments/'+doctor_id+'/',
    type: "GET",
    dataType: "json",
    success:function(data) {
       // enable only dates in the "data" array
    }
});

Any ideas how I can achieve that only dates in the array are enabled/can be selected in the datepicker?

ignite-me
  • 738
  • 3
  • 14
  • 33
  • This is a duplicate question, and you should indeed consult the above answers. I would offer though that your case is only complicated by being asynchronous. I would suggest using the solution provided in http://stackoverflow.com/questions/389743/how-to-limit-days-available-in-jquery-ui-date-picker and checking against a promise returned by your ajax call. – Rafael Kennedy Apr 11 '17 at 13:16
  • @RafaelKennedy I'm still struggling to understand where my Ajax call should go... And how to get that ajax response as a variable into another function? it just doesn't seem to work at all. – ignite-me Apr 11 '17 at 15:27
  • Sure. I would construct a new promise: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise – Rafael Kennedy Apr 11 '17 at 19:30
  • Sure, I haven't tried it, but this is what I would do: `var list = new Promise((resolve, reject)=>{ $.ajax({..., success: function(data){ resolve(data) }, error: function(e){ reject(e) } }) }) list.then((array) => { $('input').datepicker({ beforeShowDay: function(date){ var string = jQuery.datepicker.formatDate('yy-mm-dd', date); return [ array.indexOf(string) == -1 ] } }); }) ` – Rafael Kennedy Apr 11 '17 at 19:39

0 Answers0