disable or enable specific date

Closed
Travelo - Travel, Tour Booking HTML5 Template Travelo - Travel, Tour Booking HTML5 Template January 12, 2019
Login to reply
Kelly R Support Agent
5 years ago
Resolved.
abdalla ali
5 years ago

hi,
Thank you very much, I did and linked it with PHP and You have helped me
find the function

Kelly R Support Agent
5 years ago

Hi,

It is HTML template. We can not help about it.

You can hire a developer to do it.

Thanks for your understanding, C-Themes

abdalla ali
5 years ago

hi,
I want to send variables from PHP to the function

Kelly R Support Agent
5 years ago

Hi,

You can find following javascript code in /js/theme-scripts.js file. 

tjq(this).datepicker({

            showOn: 'button',

            buttonImage: 'images/icon/blank.png',

            buttonText: '',

            buttonImageOnly: true,

            changeYear: false,

            /*showOtherMonths: true,*/

            minDate: minDate,

            dateFormat: "mm/dd/yy",

            dayNamesMin: ["S", "M", "T", "W", "T", "F", "S"],

              beforeShow: function(input, inst) {

                var themeClass = tjq(input).parent().attr("class").replace("datepicker-wrap", "");

                tjq('#ui-datepicker-div').attr("class", "");

                tjq('#ui-datepicker-div').addClass("ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all");

                tjq('#ui-datepicker-div').addClass(themeClass);

            },

            onClose: function(selectedDate) {

                if ( tjq(this).attr('name') == 'date_from' ) {

                    if ( tjq(this).closest('form').find('input[name="date_to"]').length > 0 ) {

                        tjq(this).closest('form').find('input[name="date_to"]').datepicker("option", "minDate", selectedDate);

                    }

                }

                if ( tjq(this).attr('name') == 'date_to' ) {

                    if ( tjq(this).closest('form').find('input[name="date_from"]').length > 0 ) {

                        tjq(this).closest('form').find('input[name="date_from"]').datepicker("option", "maxDate", selectedDate);

                    }

                }

            }

        });

and replace it with following.

var disabledDates = ["01/15/2019","01/16/2019","01/28/2019"];

tjq(this).datepicker({

            showOn: 'button',

            buttonImage: 'images/icon/blank.png',

            buttonText: '',

            buttonImageOnly: true,

            changeYear: false,

            /*showOtherMonths: true,*/

            minDate: minDate,

            dateFormat: "mm/dd/yy",

            dayNamesMin: ["S", "M", "T", "W", "T", "F", "S"],

   beforeShowDay: function(date){

    var string = jQuery.datepicker.formatDate('mm/dd/yy', date);

    if (tjq.inArray(string, disabledDates) != -1) {

     return [false, "","UnAvailable"];

    } else{

      return [true,"","Available"];

    }

   },

            beforeShow: function(input, inst) {

                var themeClass = tjq(input).parent().attr("class").replace("datepicker-wrap", "");

                tjq('#ui-datepicker-div').attr("class", "");

                tjq('#ui-datepicker-div').addClass("ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all");

                tjq('#ui-datepicker-div').addClass(themeClass);

            },

            onClose: function(selectedDate) {

                if ( tjq(this).attr('name') == 'date_from' ) {

                    if ( tjq(this).closest('form').find('input[name="date_to"]').length > 0 ) {

                        tjq(this).closest('form').find('input[name="date_to"]').datepicker("option", "minDate", selectedDate);

                    }

                }

                if ( tjq(this).attr('name') == 'date_to' ) {

                    if ( tjq(this).closest('form').find('input[name="date_from"]').length > 0 ) {

                        tjq(this).closest('form').find('input[name="date_from"]').datepicker("option", "maxDate", selectedDate);

                    }

                }

            }

        });

and try again.

Regards, C-Themes

abdalla ali
5 years ago

hi Can you help me to disable or enable specific date in datepicker depend on value , and this code i used And does not work 

<script type="text/javascript">

var disabledDates = ["01/15/2019","01/16/2019","01/28/2019"]

$('input').datepicker({

    beforeShowDay: function(date){

        var string = jQuery.datepicker.formatDate('mm/dd/Y', date);

        return [ disabledDates.indexOf(string) == -1 ]

    }

});

   <input type="text" name="date_to" id="txtDate" class="input-text full-width" required data-readonly />

</script>