Highlighting the Current or Future Date in the Datepicker


If you need to highlight a current or future date within the datepicker, here’s a code snippet to do it.

Note: You’ll need to replace #input_1_20 with a selector for your field.


jQuery(document).ready(function($) {
    $( "#input_1_20" ).datepicker({ 
        defaultDate: '+7d',
        minDate: '+7d',
        gotoCurrent: true,
        prevText: '',
        showOn: 'both',
        buttonImage: 'https://s22280.pcdn.co/wp-content/plugins/gravityforms/images/calendar.png',
        buttonImageOnly: true


Your code snippet can be placed in an HTML field on your form or in a theme custom JavaScript file.

See also the JavaScript/jQuery section in this article: Where Do I Put This Code?