Hi all,

I am not a jQuery expert and I need you guys to help me out here please. I have two text boxes that allows a user to enter a datetime stamp (using datetimepicker for it), but I need to make sure the end timestamp is greater than the start one. I am using the jquery validate plug-in with a custom method for it.

1. --- Code snip #1 start ---
   jQuery.validator.addMethod("startEndCheck", function(value, element, params) {
    if (!/Invalid|NaN/.test(new Date(value))) {
    return new Date(value) > new Date($(params).val());
    } 
    return isNaN(value) && isNaN($(params).val()) || (parseFloat(value) > parseFloat($(params).val())); 
   },'Must be greater than start time.');
   //--- Code snip #1 end ---
   
   
   
   
   
   
   
   

This how I am defining my datetimepicker (Code Snip #2)

1. //--- Code Snip #2 start ---
   $(document).ready(function() {
    $('#start_time').datetimepicker({ ampm: true,timeFormat: 'hh:mm:ss' }); 
    $('#end_time').datetimepicker({ ampm: true,timeFormat: 'hh:mm:ss' }); 
    $('#ui-datepicker-div').wrap('');
    $("#end_time").rules('add', { startEndCheck: "#start_time" }); 
   });
   //--- Code Snip #2 end ---
   
   
   
   
   
   
   
   

I also have a fullcalendar jquery plug-in added to the same page. As soon as I add the

1. $("#end_time").rules('add', { startEndCheck: "#start_time" });
   

My fullcalendar vanishes away. I am not sure how to trouble shoot this and I need an expert advice here.

Thanks a bunch for your time/help!