Checking Dates with Calendar Extender and JavaScript in ASP.NET

Is it possible to utilize JavaScript in order to prevent selection of Saturdays and Sundays on my Calendar Extender?

At present, I am disabling previous dates using code-behind during page load.

public partial class TESTING : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        txtDelivery_CalendarExtender.StartDate = DateTime.Now;
    }
}

ASP.NET Controls

<asp:TextBox ID="txtDelivery" runat="server"></asp:TextBox>

<asp:CalendarExtender ID="txtDelivery_CalendarExtender" runat="server" 
    PopupButtonID="ImageButton1" TargetControlID="txtDelivery" >
</asp:CalendarExtender>

<asp:ImageButton ID="ImageButton1"
    runat="server" ImageUrl="~/Images/Calendar.png" />

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

I would also like to disable a specific range of days starting from today.

For instance, if today is November 4, 2012, and I want to exclude 10 working days, then the dates between November 4 and 14 should be disabled.

Appreciate your help in advance.

javascriptasp.netvalidationdatecalendarextender

Answer №1

To disable weekends, adjust your control's markup as shown below:

<asp:CalendarExtender ID="txtDelivery_CalendarExtender" runat="server" 
    PopupButtonID="ImageButton1" TargetControlID="txtDelivery" OnClientShown="DisableWeekend" >
</asp:CalendarExtender>

Then, implement the following JavaScript function:

function DisableWeekend(sender, args) {
        $(".ajax__calendar_day[title*='Saturday'],.ajax__calendar_day[title*='Sunday']").each(function () {
            $(this).parent().addClass('ajax__calendar_invalid');
        });
}

If you require more precise control over the calendar control's behavior through JavaScript, I recommend examining the CalendarBehavior.js file closely.

Answer №2

Here are a few things you can experiment with:

Python

def DisableWeekends(sender, args):
    for day in sender._days.all:
        for j in range(6):
            if day.id == “calendarValidToDate_day_” + str(j) + ”_0″:
                day.disabled = True
                day.innerHTML = “<div>” +day.innerText+ “</div>”
                
            if day.id == “calendarValidToDate_day_” + str(j) + ”_6″:
                day.disabled = True
                day.innerHTML = “<div>” +day.innerText+ “</div>”

.html

<input type=”text” id=”txtDate” disabled=”false” style=”width: 200px;” />
<button id=”imageValidToDate” style=”skinID: calendarButton;” ></button>
<div id=”calendarValidToDate” data-target=”txtDate” data-format=”dd/MM/yyyy”
     data-popup-button=”imageValidToDate” data-first-day=”Default” 
     onmouseover=”DisableWeekends()”>
</div>

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

Removing an element from a state array: A step-by-step guide

Imagine a scenario where Bob, Sally, and Jack can be placed into a box, with the option to remove any one of them at will. Once taken out of the box, there are no empty slots left behind. people = ["Bob", "Sally", "Jack"] If we choose to remove "Bob" fro ...

javascriptarraysreactjs

Angular: Assigning a key from one variable to a value in another

I am currently facing a challenge with rendering a form on a page using ng-repeat, where the data for this form is dynamically fetched from a request. Within this data, there is a nested array called "categories" which contains IDs. I want to display the n ...

javascriptangularjsarrays

Retrieving Data from a Database Using JS and NodeJs: Utilizing AJAX to Access Table Data and Showcase it in a

Currently, I am in the process of working on a project using NodeJS where I need to extract data from a MySQL database through AJAX and then display the retrieved table rows in an HTML table format. However, it seems like I might be encountering an issue ...

javascriptmysqlajaxnode.jsloops

Resource for building user interface components in Javascript

I need assistance with implementing a feature that involves scrolling through different text blocks and corresponding images. Users should be able to select a specific text block and have the associated image on the right scroll into view, similar to a car ...

javascriptjqueryhtmlcssuser-interface

What is the purpose of including an es directory in certain npm packages?

Why do developers sometimes have duplicated code in an es folder within libraries? Here are a few examples: https://i.stack.imgur.com/BWF6H.png https://i.stack.imgur.com/3giNC.png ...

javascriptnpm

The current environment does not recognize the term 'ScriptManager'

After attempting to solve a JavaScript issue following an AJAX postback in ASP.Net by implementing some code, I encountered an unexpected error during the build process: An unexpected error occurred: The name 'ScriptManager' does not exist in th ...

javascriptasp.netwebformsasp.net-ajaxscriptmanager

Trigger refetchQueries post-execution of a mutation operation

In the past, I executed a mutation in a similar manner as shown below: export const useEditLocationName = () => { const [editFavoriteLocationName] = useEditFavoriteLocationNameMutation({ refetchQueries: [{ query: GetMyFavouritePlacesDocument}], ...

javascriptreactjstypescriptgraphqlapollo

Arranging a JSON array based on the numerical value within an object

I am interested in sorting an array from a json file based on distances calculated using the haversine library. The purpose is to find geolocations near a specified value and display the closest results first. function map(position){ var obj, ...

javascriptjsonsortingobjectnumeric

jQuery is unable to locate elements

Here is a JavaScript code snippet that I have: (function($, undefined) { $("a").click(function(event) { //or another elemtnt alert('Hello!'); }) })(jQuery); Also, here is the link being referenced in the code: <a href="http: ...

javascriptjquery

Is it possible for me to reach a directory on the client side within a web application?

Is there a way to retrieve all files from a folder in a web application and display them in a listbox for the user? I am familiar with how this can be done in a Windows application, but I am unsure if it's possible in a web application. If so, what w ...

.netasp.net

Discovering the value of a checkbox using jQuery and Ajax

I have a challenge with sending the state of multiple checkboxes on my page back to the database using ajax. While I am comfortable working with jquery and ajax for SELECT and OPTIONS elements, I am struggling to do the same for checkboxes and extracting t ...

javascriptjqueryajaxcheckbox

Exploring the intricacies of Implementing Chromecast Networks, with a curious nod towards potentially mirroring it with

In my current project, I am aiming to replicate the functionality of a Chromecast on a Roku device. To achieve this, I need to first discover the Roku using UDP and then send an HTTP POST request to control it. During a recent developer fest where I learn ...

javascriptgoogle-chrome-extensionxmlhttprequestchromecastroku

Form with several file selection points

I am working on an application that features a dynamic form capable of uploading files to different individuals simultaneously. Each person is assigned a unique input file and has the option to add up to 2 additional dynamic inputs. <div id="InputsWra ...

javascriptjqueryajax

Obtaining the latest state within the existing handler

In my React application, I have a handler that shuffles the state entry data: state = { data:[1,2,3,4,5] }; public handleShuffle = () => { const current = this.state.data; const shuffled = current .map((a: any) => [Math.random() ...

javascriptreactjs

React Native: LogBox now including all warnings

Looking for a way to use LogBox to filter out specific log messages, but despite my attempts to ignore them, they still show up in the console... "react-native": "0.68.2", In my main file (index.js), this is how I've tried to impl ...

javascriptreactjsreact-native

Surprising outcomes encountered while attempting to load a text file into an array with JavaScript

Currently, I am in the process of developing an emulator and seeking to compare opcode logs from another functional emulator. The log containing executed opcodes is prepared for comparison and follows this format: //log.txt (10000 lines long) 0 195 33 195 ...

javascriptnode.jsfs

When utilizing Google Analytics in conjunction with Next.Js, encountering the error message "window.gtag is not

Encountering an error on page load with the message: window.gtag is not a function Using Next.js version 14.0.4. All existing solutions seem to hinder data collection, preventing the website from setting cookie consent correctly. I am uncertain about the ...

javascripttypescriptnext.jsgoogle-analyticsgtag.js

Retrieve the property called "post" using Restangular

With the following code, I am fetching a list of 'postrows': $scope.postrows = {}; Restangular.all('/postrows').getList().then(function(data){ $scope.postrows = data; }); The returned JSON structure is as follows: { id: 1, post ...

javascriptjsonangularjspostrestangular

Nested ng-repeat in AngularJS by numeric value

Looking to create a sliding carousel layout for displaying a bunch of data with 8 points per slide. The desired structure is as follows: Slide datapoint 1 datapoint 2 datapoint 3 datapoint 4 datapoint 5 datapoint 6 datapoint 7 ...

javascriptangularjs

React hook, when not properly called, may result in an error known as

While working on a project with React hooks, I encountered the error message below. Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might ha ...

javascriptreactjsreact-hooks