Thought Delimited

My second Android app, MyReminders, has been on the Android Market for 30 days now, and I wanted to share some stats as well as some things I've observed and experienced over that time period.

Read more...

Now that I have two apps listed in the Android Market, I thought I would write up something about the publication process to let folks know what to expect when they to go publish their own Android apps.

Read more...

In addition to providing a number of standard validation rules, the jQuery Validation plugin also allows you to create your own validation rules via the addMethod() function.  Today I had a situation where I had to use that function:  I had to create a rule to ensure that the end date of a date range determined by the user was later than the starting date.  I thought I'd share what I came up with.

The details of the situation:

• The user set the starting date using two radio buttons and a text field bound to the jQuery UI Datepicker.  Selecting the first radio button meant that the start date (the "now" button) should be set to the current date, while selecting the second radio button (the "later" button) meant that the starting date would be determined by the value in the Datepicker field.
• The user set the ending date using another Datepicker-bound text field.
• The Datepicker plugin ensures that the date is always in the format "mm/dd/yyyy".

Here is the code:

jQuery.validator.addMethod("dateComparison",function(value,element) {
    var result= true;			
    if($("#startDateOptionLater:checked").length== 1) 
      {
        var dateArray= $("#startDate").val().split("/");
        var startDateObj= new Date(dateArray[2],(dateArray[0]-1),dateArray[1],0,0,0,0);
      } 
    else 
      {
        var exactDate= new Date();
        var year= exactDate.getFullYear();
        var month= exactDate.getMonth();
        var day= exactDate.getDate();
        var startDateObj= new Date(year,month,day,0,0,0,0);
      }
				
    var endDateArray= $("#endDate").val().split("/");
    var endDateObj= new Date(endDateArray[2],(endDateArray[0]-1),endDateArray[1],0,0,0,0);
    var startDateMilliseconds= startDateObj.getTime();
    var endDateMilliseconds= endDateObj.getTime();
				
    if (endDateMilliseconds <= startDateMilliseconds) 
      {
        result= false;
      }
     
    return result;

 },"The ending date must be a later date than the start date");

So if the user selected the second start date option and chose a date using the Datepicker widget, the code splits up the date string into an array and uses the individual month, day, and year values to create a Date object. If the user selects the option of making today the starting date, a new Date object is created (which by default has the value of the current date and time) and the code creates a new Date object with the same date but with the time-specific data stripped out (because the end date will not have a time value attached to it).

The Date object for the end date is created with the same technique used for the second start date option, and then the getTime() function is used on both the start and end Date objects to get the number of milliseconds between each date and January 1, 1970 (a starting point for date and time values used in both JavaScript and Java). Then it does the comparison between the two dates.

It's then a simple matter of applying this custom method somewhere within the normal jQuery Validation rules block:

...
rules: {
    endDate: {
      required: true,
      dateComparison: true
    }
...