Jquery Date range - functionality lost upon selecting a date

Hello,

I've seen many posts on the date range and date picker functionality but unfortunately they have not fixed my issue.

-I have created two date fields in my form

-I use the following code in a file called date-range.js

var $j = jQuery.noConflict();

$j(document).ready(function(){

$j("#input_3_21").datepicker({
defaultDate: '+1d',
minDate: '+1d',
changeMonth: true,
numberOfMonths: 3,
onSelect: function( selectedDate ) {
				$j( "#input_3_22" ).datepicker( "option","minDate", selectedDate );
			}

	});   

$j("#input_3_22").datepicker({
defaultDate: '+1d',
minDate: '+1d',
changeMonth: true,
numberOfMonths: 3,
onSelect: function( selectedDate ) {
				$j( "#input_3_21" ).datepicker("option","maxDate", selectedDate );
			}

	});   

});

In my theme functions file I use:

add_action('gform_enqueue_scripts_3', 'enqueue_date_range_script', 10, 2);
function enqueue_date_range_script($form, $is_ajax) {
        wp_enqueue_script('date_range_script', get_stylesheet_directory_uri() . '/js/date-range.js', array('jquery'));
}

Before selecting any date everything is fine. The default, mindate and three visible months all work as expected when I click the field.

The problem occurs on selecting a date in my SECOND date field (the 'to' date). When I do this and go back to my first date field ( the 'from' date) to change the date, all values are greyed out.

In the second date field the mindate and other conditions are lost when selecting a date in field one.

I am also able to select a date before the date of date field one, which should not be possible.

The code for the date range was copied from here:

http://jqueryui.com/demos/datepicker/#date-range

I made some minor adjustments.

Using the code below, which I found here:

http://stackoverflow.com/questions/5922184/create-a-specific-date-range-with-jquery-datepicker

it does seem to work. Still I'd like to know why the other code didn't, since I understand it better.

var $j = jQuery.noConflict();

$j(document).ready(function(){

var fromDate = $j("#input_3_21").datepicker({
        defaultDate: "+0d",
        changeMonth: true,
        numberOfMonths: 2,
        minDate: new Date(),
        onSelect: function(selectedDate) {
            var instance = $j(this).data("datepicker");
            var date = $j.datepicker.parseDate(instance.settings.dateFormat || $j.datepicker._defaults.dateFormat, selectedDate, 

instance.settings);
        toDate.datepicker("option", "minDate", date);
        }
    });

    var toDate = $j("#input_3_22").datepicker({
        defaultDate: "+0d",
        changeMonth: true,
        numberOfMonths: 2
    });

});