How to call Date Disable function in <b-calendar> component from another function

[Shahzaib4321]

Hi Everyone,

I am using component in my web application and I am looking to disable the all the dates which I received from database dynamically on @context change event. Below is the sample code. However, it it not disabling the dates. Please advise.

<b-calendar size="sm" v-model="value" label-no-date-selected="select date" label-help="custom label" :min="min" :max="max" required :date-disabled-fn="dateDisabled" locale="en" @context="onDatePickerContext" placeholder="Date"> <div class="d-flex" dir="ltr"> <b-button size="sm" id="reset_date" variant="outline-danger" @click="clearDate"> Clear Date </b-button> </div> </b-calendar>

Methods:

dateDisabled(ymd, date, disableDatesFlag) {
          const weekday = date.getDay()
          if (disableDatesFlag) {
              return true;
          }
          else {
              if (weekday === 0) {
                  return true;
              }
          }
      },


onDatePickerContext(ctx) {
          if (ctx.activeYMD != "") {
              var dateArr = ctx.activeYMD.split("-");
              if (dateArr[0] == this.activeYearContext && dateArr[1] == this.activeMonthContext) {
                  this.activeYearContext = dateArr[0];
                  this.activeMonthContext = dateArr[1];
              }
              else {
                  this.activeYearContext = dateArr[0];
                  this.activeMonthContext = dateArr[1];
                  axios.get(tools.url("apiURL/" + ctx.activeYMD + '/' + this.activeYearContext + '/' + this.activeMonthContext)).then((response) => {
                      if (response.data.length > 0) {

                          for (var i = 0; i < response.data.length; i++) {
                              this.dateDisabled(response.data[i], new Date(response.data[i]), true);
                          }
                      }

                  }).catch((error) => {
                      alert("ERROR05: Failed to get available hours");
                  })

              }
          }
      },