How to disable/grey out Bootstrap datepicker

Question

I have a dropdown menu with two values, I want to disable or grey out bootstrap datepickers when a particular value is chosen from the drop down.

Using Javascript or JQuery is there any way to disable or grey out a bootstrap datepicker so that a user cannot enter any value?

I have extensively researched this online and the suggested JQuery prop and atr methods have no effect.

I have attached an image of what the screen should ideally look like below:

Answer 1

suppose your drop down list has id ddlSelect and your calendar as inputCalendar

$("#ddlSelect").change(function(){
   var ddlValue = $("#ddlSelect option:selected").val();
   if(ddlValue == 'specific value'){
     $("#inputCalendar").prop('disabled', true);
   }
})

Answer 2

callback: {
                    message: 'The Message You want if',
                    callback: function(value, validator) {
                        var m = new moment(value, 'Condition you want', true);
                        if (!m.isValid()) {
                            return true;
                        }
                        return m.isAfter(globCommonVar.Your_value);
                    }
                }

May this work for u too ...... Bdw this part is in validator