Deactivate particular months within the JqueryUI date picker

I'm currently working on a booking form that involves the jQuery UI Datepicker. I've encountered a major issue that I could use some assistance with: There are certain trips where only specific days are available for booking, and these trips can only be sold during certain months due to factors like cyclone season.

While I have successfully managed to disable specific weekdays using a function, I am unsure about how to deactivate entire months such as October. Is this even possible?

I would greatly appreciate any advice on this matter. Below is a snippet of my code. Please let me know if further clarification or additional parts of the code are needed. Thank you in advance!

$.datepicker.setDefaults( $.datepicker.regional[ getLanguage() ] );

$( "#booking" ).datepicker({
   showOn: "button",
   dateFormat : 'yy/mm/dd',
   buttonText: "Select",
   beforeShowDay: disableSpecificWeekDays,
   changeMonth: true,
   changeYear: true,
   minDate: 0
}
);

// 0 = monday, 1 = tuesday, 2 = wednesday, 3 = thursday, 4=friday, 5 = saturday, 6=sunday
var daysToDisable = [1, 4, 6];

function disableSpecificWeekDays(date) {
            var day = date.getDay();
            for (i = 0; i < daysToDisable.length; i++) {
                if ($.inArray(day, daysToDisable) != -1) {
                    return [false];
                }
            }
            return [true];
 }

Using the provided code, I am able to disable specific dates. However, when it comes to deactivating an entire month, the process becomes cumbersome as I would need to specify each individual date. In some cases, I may need to deactivate multiple months for a single trip.

var $disableMonths = new Array("2013/10/01","2013/10/02","2013/10/03", "...");

function disableSpecificMonths(mydate){
var $return = true;
var $returnclass ="available";

$checkdate = $.datepicker.formatDate('yy/mm/dd', mydate);

    for(var i = 0; i < $disableMonths.length; i++) {
            if($disableMonths[i] == $checkdate) {
                $return = false;
                $returnclass= "unavailable";
            }
    }

return [$return,$returnclass];

}

If disabling an entire month proves to be impossible, I am open to suggestions on how to combine the functions for deactivating specific weekdays and specific dates. This way, I could effectively manage both restrictions simultaneously.

Answer №1

If you want to modify your "disable function", consider the following adjustments:

let daysToDeactivate = [2, 5, 7];
let monthsToDeactivate = [8];

function deactivateSpecificWeekdays(date) {
    let dayOfWeek = date.getDay();
    if (daysToDeactivate.includes(dayOfWeek)) {
        return [false];
    }

    let monthOfYear = date.getMonth();
    if (monthsToDeactivate.includes(monthOfYear)) {
        return [false];
    }
    return [true];
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Concealing an HTML form field until a dropdown selection is made

I have been struggling with my JavaScript code, searching for a solution to hide a form option (label and textbox) until a value is selected from a dropdown. Specifically, I want to hide the label and input box for "lookup" until a value is selected from t ...

Having trouble loading HTML content from another file

Here is the code snippet in question: <script> var load = function load_home(){ document.getElementById("content").innerHTML='<object type="type/html" data="/linker/templates/button.html" ></object>'; } </script> ...

Display concealed information upon clicking

Is there a way to reveal hidden content only after clicking on the "View" link instead of hovering over it? I have tried implementing it so that the content appears on click, but it doesn't seem to be working as expected. How can I achieve this usin ...

What is the best way to send a JavaScript array to a Perl script using AJAX?

Is it possible to convert a JavaScript array passed via AJAX into a Perl array? Accessing in Perl: @searchType = $cgi->param('searchType'); print @searchType[0]; Result: employee,admin,users,accounts It appears that the first value in the ...

Having trouble with your Ajax JQuery request?

I am currently attempting to create a basic AJAX request to the URL provided below: When I enter the URL directly into the browser's navigation bar and press enter, I receive the JSON response. However, when attempting to make a jQuery AJAX call, it ...

What is the best way to extract the frameset from a frame window?

Here is a code snippet to consider: function conceal(frameElem) { var frameSet = frameElem.frameSet; //<-- this doesn't seem to be working $(frameSet).attr('cols', '0,*'); } //conceal the parent frame conceal(window.pa ...

Tips on navigating an array to conceal specific items

In my HTML form, there is a functionality where users can click on a plus sign to reveal a list of items, and clicking on a minus sign will hide those items. The code structure is as follows: <div repeat.for="categoryGrouping of categoryDepartm ...

Unable to adjust image opacity using jQuery

I am attempting to change the opacity of an image based on a boolean flag. The image should have reduced opacity when the var pauseDisabled = true, and return to full opacity when pauseDisabled = false. To demonstrate this, I have created a fiddle below. ...

Exploring the Art of Programming SVG

I am thinking about creating a website that is similar to stackoverflow, but with the added feature of allowing answers to include drawings such as schematics. I would like to have a section in the answer form where users can create these schematics with ...

I am attempting to transfer information from one page to another in Next.js, but unfortunately, I am experiencing difficulties in

Encountering the following error message: "Error: Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead." Any assistance will be greatly appreciated. export default func ...

Issue encountered when attempting to load an STL file in three.js

I'm attempting to display a preview of an STL file using three.js. I came across a tutorial that seems to provide exactly what I need: Tutorial However, when I try to implement the code, I keep running into an error message saying undefined is not a ...

Have you ever wondered why Vue 3 imports all JS files for every page upon the initial project load?

Is there a way to make Vue 3 import only the necessary js files for each component instead of loading all files at once when the project is first loaded? For example, if I navigate to the contact page, Vue should only import the contact.js file, rather tha ...

Navigate to a specific position with a single click by accessing a class from another Vue component

Clarification of the issue When a user clicks on the login link, the view should automatically scroll down to the login window where they can input their credentials. I know how to achieve this in a single file using document.getElementById('login-w ...

Are you experiencing a strange problem with the CSS button when hovering, clicking, or with the border?

Check out the code for this implementation on jsfiddle: https://jsfiddle.net/xuhang1128/cmkbu07s/2/ I utilized React and React-bootstrap to create it. .design2-statusMonitor { margin-top: 20px; .list-group-item { display: inline-block; ...

Automatically Activate/Deactivate a button

I am working on a project with a button for asking questions and a countdown timer set to end at 2017/04/30 10:30:00. My goal is to have the button automatically disable when the timer reaches 0, and then re-enable when the timer is greater than 0. Curren ...

Utilizing jQuery to Retrieve Column and Row Headers of a Selected Cell

I am currently working on a JavaFX project that includes a WebView. The HTML code is being generated using a StringBuilder. My goal is to retrieve the column and row headers of the selected cell. This information is necessary for my Java code. You can ...

What steps can be taken to create an electron menu for easily conducting a general search within the current window?

I am searching for a solution to create an electron menu that includes the label "Find..." and performs a general search within the current browser window. While I was successful in adding the option, I am struggling to figure out how to access the browser ...

Prevent specific fields from being saved in Node MongoDB native

When working with MongoDB and using the node mongodb native driver to insert documents, I have encountered an issue. The objects I am inserting have fields that I do not want to be saved in the database: var x = { field: 'value', _nonPersist ...

Tips for avoiding Client DOM XSS vulnerability in JavaScript

Upon completing a checkmarx scan on my code, I received the following message: The method executed at line 23 of ...\action\searchFun.js collects user input for a form element. This input then passes through the code without proper sanitization ...

Error Encountered in Next.js: PDFtron Webviewer - Troubleshooting

I'm currently working on a website that incorporates a dynamically imported PDF viewer within the page. When running the code locally, everything operates smoothly with no errors. However, when executing the "npm run build" command, I encounter the fo ...