Javascript To Validate Start Date And End Date In Asp.net

I have written a JS that should check that start date is less than end date. If not, alert should be thrown The JS is written as; function DateValidation(startDate, EndDate) {

Solution 1:

You need to parse the string values to dates

if (startDate!= '' && EndDate!='') {  
    var stdate = Date.parse(startDate);   
    var enddate = Date.parse(EndDate);  
    if (stdate > enddate) {   
        alert('Start date cannot be greater than end date');   
        return false;   
    }   
    else
    {   
        return true;   
    }   
} 

Without further code it's hard to tell why your button only fires the event on the second click. Is your button disabled to start with?

Solution 2:

Use Date.parse. What you are doing is checking whether a string is greater than another string.

Also the script will take only whatever is there at the first time in txtStartDate.Text, txtEndDate.Text EVERY time the script runs.

Why? You have not correctly understood server side and client side execution.

This line in your code,

btnShowReport.Attributes.Add("onclick", "return DateValidation('" + txtStartDate.Text + "', '" + txtEndDate.Text + "');");

registers the script to the page passing the text in those text boxes.

You have assumed that each time the text changes in the text box, the method will take the new values and do the date calculation.

However your script would look something like this, assuming the two text boxes are empty when the page is loaded. You can verify this by checking the page source.

<inputid="btnShowReport" ... onclick="return DateValidation('','')>

Because JavaScript is run at client side, the server is not contacted each time to get the current values of those text boxes.

What you can do is pass the text boxes it self to the method. Something like

return DateValidation(txtStartDate.ClientID, txtEndDate.ClientID);

and from the method you can access it like shown below

function DateValidation(txtStartDate, txtEndDate) {
                debugger;
                var stdate = Date.parse(txtStartDate.value);

Solution 3:

I think the problem is that you're not comparing dates - you have just declared them as vars without a type so they're essentially Strings.

Check out the Date.parse() method.

Solution 4:

Adding to what the previous 2 guys have answered with, you have to parse the dates. You also need to validate that they are even dates. I use this library often when working with dates on the client side:

http://www.datejs.com/

Solution 5:

The main problem is how you register the event. You are creating a string with code that contains string literals with the values, which means that you get the values from the textboxes at the time that you create the string, not at the time that the event is activated. You have to make a postback before the code is updated with the current values, that is why it doesn't work on the first click.

Create code that gets the values at the time of the click:

btnShowReport.Attributes.Add("onclick", "return DateValidation(document.getElementById('" + txtStartDate.ClientID + "').value, document.getElementById('" + txtEndDate.ClientID + "').value);");

Another possible problem is that the code doesn't compare dates, it compares strings. Some date formats are comparable as strings, e.g. ISO 8601 based formats: "2010-12-31" < "2011-01-01", but other date formats has to be parsed into dates to be compared, e.g. "31/12/2010" > "01/01/2011".

Parse the dates after checking that they are not empty:

...
if (startDate != '' && EndDate != '') {
  var stdate = Date.parse(startDate);
  var enddate = Date.parse(EndDate);
  ...