Using JavaScript to validate birth date selection along with three drop down menus in ASP.Net

Currently, I have implemented a functionality using three drop down controls to prompt users to select their birth date. In order to validate the selected date, I have incorporated JavaScript code in all three drop down "onChange" events.

The function is designed to verify if the selected date exceeds the maximum date of the month and adjust the date in the drop down accordingly. However, despite functioning correctly, it fails to display the current selection. The complete JavaScript code is provided below:

function CheckValidDate() {

        var getMonthControl = document.getElementById('<%= ddlBirthdateMonth.ClientID %>');
        var SelectedMonth = getMonthControl.options[getMonthControl.selectedIndex].value;

        var getYearControl = document.getElementById('<%= ddlBirthdateYear.ClientID %>');
        var SelctedYear = getYearControl.options[getYearControl.selectedIndex].value;

        var getDateControl = document.getElementById('<%= ddlBirthdateDate.ClientID %>');
        var SelctedDate = getDateControl.options[getDateControl.selectedIndex].value;

        if (SelectedMonth > 0 && SelctedYear > 0 && SelctedDate > 0) {
            var month = SelectedMonth;
            var NewDate = new Date(SelctedYear, month, 0);
            var MonthMax = NewDate.getDate();
            if (MonthMax <= SelctedDate) {
                setDropDownList(getDateControl, MonthMax);
            }
        }
        return false;
    }
    function setDropDownList(elementRef, valueToSetTo) {
        var isFound = false;
        for (var i = 0; i < elementRef.options.length; i++) {
            if (elementRef.options[i].value == valueToSetTo) {
                elementRef.options[i].selected = true;
                isFound = true;
            }
        }
        if (isFound == false)
            elementRef.options[0].selected = true;
    }


Upon further inspection, I noticed that the value selection functions properly, but the display on the page remains unchanged. Can anyone please assist me with this issue?

Regards, Dhaval

Answer №1

My apologies, after creating a separate application and testing it, I have discovered that it is functioning properly. The issue seems to be with the jQuery code that is being used for styling these dropdown controls.

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

Comparison of Vue CLI 3 vue.config.js and webpack.config.js in terms of handling plugins

Currently in my Vue CLI 3 setup, I'm encountering an issue with implementing the Terser Webpack Plugin to remove console.log and comments from the code. Despite following the production workflow below: Execute npm run build Run serve -s dist vue.co ...

React-Router-Dom: The website is failing to render any content on the page

Recently, I started my journey to learn how to use ReactJS and I successfully installed react-router-dom. Excited to implement it, I decided to begin by setting up my App.js file as follows: function App() { return ( <Router> <div> ...

Error: ASP stylesheet no longer functioning

Why won't my CSS changes apply after I update the file? Even though it was working before, now when I make a change to my CSS file, the updates do not take effect. When viewing the applied styles on IE11 in troubleshoot mode, I am seeing the old sett ...

Having trouble with syntax when using THREE.TextureLoader?

Attempting to implement a panoramic viewer code using three.js version r68. To utilize the raycaster function, upgraded the three.js version to r121. However, encountered an issue while modifying the code: var texture = THREE.ImageUtils.loadTexture('i ...

Troubleshooting Bootstrap select box design discrepancies

Currently revamping a website and encountered an unusual issue with select boxes. There seems to be an overlapping white space where the option values should be. Here's a visual reference: View Image of Select Box Issue Utilizing Bootstrap for the re ...

What is the method to determine the overall size of a webpage using the Google PageSpeed API?

"analytics": { "cssResponseBytes": "333 kB", "htmlResponseBytes": "269 kB", "imageResponseBytes": "3.35 MB", "javascriptResponseBytes": "2.29 MB", "numberCssResources": 2, "numberHosts": 80, "numberJsResources": 72, "numberR ...

On initial load, React router switch fails to find a match

I am encountering an issue with my switch and react-router. Whenever I open a new tab and navigate to any path, it always redirects me to /login. However, if I remove the bottom switch (the one without a path - the default), everything works as expected. A ...

Executing a Google Script will result in a newly inserted column automatically adopting the

My coding issue involves a simple scenario where cell A1 contains a date, for example 06/06/2017. What I aim to do is add three columns and apply formulas to them. I insert columns using the following code: ss.insertColumns(1,3); Subsequently, I set for ...

Discover the dropdown options displayed in the React js console

My task is to retrieve the selected dropdown item and display it in the console using React js. Here is the code snippet: <div onClick={this.handleSearchBtn} className="dropdown-menu"> <a className="search-item dropdown-item" href="#" >Auth ...

Error: The requested ASP.NET Dynamic Data custom page could not be located

I have created a new folder named 'Check' inside the 'customPages' directory. Inside the 'check' folder, I have added a new webform page called 'show' <%@ Page Language="C#" AutoEventWireup="true" CodeFile="show. ...

Automate scrolling to the top of a webpage with Selenium WebDriver using JavaScript

I am utilizing Selenium webdriver with javascript and node.js During a certain step in my test, I need to automate clicking on a button positioned at the top of the page. However, due to some pre-treatment, the page automatically scrolls to the bottom, c ...

Issue encountered in the file located at ./node_modules/framer-motion/dist/es... where the export 'useId' (imported as 'useId') could not be located in 'react' along with 'useInsertionEffect'

After adding the framer-motion library using yarn add framer-motion, I encountered the following configuration: https://i.sstatic.net/rG2FJ.png Error message : ERROR in ./node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs 40:13- ...

Use jQuery to place tags around the content of existing <li> elements

Using jquery, I have been able to successfully create a list by using the following code: $(list).append(item); (where list is the list reference and item consists of the $('<li>') elements being added). var item = $('<li>' ...

Best practices for using parent and child methods in Vue applications

I'm exploring the most effective approach to creating a modal component that incorporates hide and show methods accessible from both the parent and the component itself. One option is to store the status on the child. Utilize ref on the child compo ...

Is there a method available to incorporate a scroller into an nvd3 chart?

I am encountering an issue with my nvd3 chart. When I have a large amount of data that exceeds the width of the chart container, there is no scroll bar present and I'm struggling to figure out how to add one. I attempted to include overflow:scroll wi ...

Is it possible to conduct brain.js training sessions multiple times?

Is there a way to specifically train my neural network with new information without having to retrain the entire model, considering the potential performance costs associated with it? The neural network was created using brain.js. ...

Is it possible to use JQuery ScrollTop while in the midst of an animation?

I am facing an issue with resizing containers and scrolling to elements. I have 2 containers that change width dynamically, each containing clickable elements. When a container is clicked, it animates the resize. However, when a clickable element is clicke ...

Using PHP and XML with Ajax can run into problems with the getElementsByTagName function in Internet

Encountering a problem with getElementsByTagName specifically in IE versions 7 and 8. An address lookup generates suggested addresses as XML strings stored in a PHP session variable. These are then accessed using an AJAX function to retrieve the desired s ...

Bind the selected value of an ASP.NET drop down list to a property on the page using data binding

I am working with a property in my Page that I would like to set as the selected value for a list. The status list is manually populated by adding items, then calling list.DataBind(). I want the value of the property to be synced with the values in the ...

JavaScript confirmation for PHP delete button

Is there a way to implement a JavaScript alert that prompts the user to confirm their action when they click the delete button? I attempted to integrate a class into an alert box: <?php //$con = mysqli_connect("localhost", "root", "root", "db"); $sql ...