Gravity Forms - Datepicker extension for Date Range Fields

dateform.js

jQuery(function ($) {

	var datepickerInArgs = {
		minDate: 1,
		defaultDate: 0,
		dateFormat: 'dd/mm/yy',
		changeMonth: true,
		changeYear: true,
		onClose: function( dateText, inst ) {
			var d = $.datepicker.parseDate( inst.settings.dateFormat, dateText );
			d.setDate( d.getDate() + 1 );
			$( '.date-out input' )
				.val( $.datepicker.formatDate( inst.settings.dateFormat, d ) )
				.datepicker( 'option', {
				minDate: $.datepicker.formatDate( inst.settings.dateFormat, d )
			});
		}
	},
	datepickerOutArgs = {
		minDate: 'd',
		defaultDate: 'd',
		dateFormat: 'dd/mm/yy',
		changeMonth: true,
		changeYear: false,
	};

	/**
	 * Reset datepicker fields with new arguments.
	 */
	function changeDatepickerArgs() {
		$( '.date-in input, .date-out input' ).datepicker( 'destroy' );

		$( '.date-in input' ).datepicker( datepickerInArgs );
		$( '.date-out input' ).datepicker( datepickerOutArgs );
	}

	$( document ).on( 'gform_post_render', changeDatepickerArgs );
});

//Thanks to Gary Jones https://github.com/garyjones for the code reveiew (and subsequent rewrite)

functions.php

<?php

//Conditionally Enqueue the Script - not on Admin and only on Contact Page template

// Add CSS class to Gravity Input field for Date Picker
// Requires setting the Description in the forms with default content
add_action('gform_field_css_class', 'twp_custom_input_class', 10, 3);
	function twp_custom_input_class($classes, $field, $form){
    if($field['description'] == 'Arrival'){
        $classes .= " date-in";
    }
    if($field['description'] == 'Departure'){
        $classes .= " date-out";
    }
    return $classes;
}

style.css

/* Restore the Calendar Icon to the Date fields
Positioning will vary according to your styles*/

.page-template-page-contact-php .gfield.date-in .ginput_container,
.page-template-page-contact-php .gfield.date-out .ginput_container{
	background: url(http://cyc.org.au/wp-content/plugins/gravityforms/images/calendar.png) no-repeat 41% 50%;
}

If you just want the second one >= the first one insert this into a HTML field in the form (and adjust the field and form IDs)
Documentation : Gravity Forms Howto

<script type="text/javascript">
<!--
jQuery( document ).ready(function($) {

gform.addFilter( 'gform_datepicker_options_pre_init', function( optionsObj, formId, fieldId ) {

  	if ( fieldId == 17 || fieldId == 18 ) {
        optionsObj.minDate = 0;
    }

    if ( formId == 5 && fieldId == 17  ) {
        optionsObj.minDate = 0;
        optionsObj.onClose = function (dateText, inst) {
            jQuery('#input_5_18').datepicker('option', 'minDate', dateText).datepicker('setDate', dateText);
    	}
    }

    return optionsObj;

});

	
});

-->
</script>

I have a question, please. I am using the Gravity Wizz Inventory plugin for products. Will this snippet select just the start and end date or all days in between as well and would it work with Inventory? I need to be able to assign products to multiple days, not just 1st and last.
Thank you so much. Great work

It is a date range - will select the days in between.

Should i just use the HTML field in the form or should i use the java script too. where should i implement the .js?
Thank you

If you don't get whats going on there you should probably hire a developer.

Thank you. Thought that's what you were. Thanks for the help