How to highlight dates between fromDate and toDate, Jquery datepicker?

Question

I have created a JS fiddle with my current code. What I want is to highlight the days between the selected "from" date all the way until the "to" date. For example if I select 29.01.2014 as my from date and the 02.02.2014 as my to date, all dates in between should be highlighted.

Also, if anyone could guide me on making the minDate for the "to" date be either the current date or the date selected in the From picker, that would be great.

What I have so far. Fiddle below.

$(function () {
    $("#From").datepicker({
        dateFormat: "yy-mm-dd",
        changeMonth: true,
        numberOfMonths: 1,
        gotoCurrent: true,
        minDate: 0,
        maxDate: "+1y",
        onClose: function (selectedDate) {
            $("#To").datepicker("option", "minDate", selectedDate);
        }
    });
});

$(function () {
    $("#To").datepicker({
        dateFormat: "yy-mm-dd",
        changeMonth: true,
        numberOfMonths: 1,
        gotoCurrent: true,
        minDate: "From",
        maxDate: "+1y",
        onClose: function (selectedDate) {
            $("#From").datepicker("option", "maxDate", selectedDate);
        }
    });
});

http://jsfiddle.net/4n4Cu/

Answer 1

Try changing your code to this

$(function () {
    $("#To").datepicker({
        dateFormat: "yy-mm-dd",
        changeMonth: true,
        numberOfMonths: 1,
        gotoCurrent: true,
        minDate:$("#From").val() == ""|| undefined ? 0 : $("#From").val() ,
        maxDate: "+1y",
        onClose: function (selectedDate) {
            $("#From").datepicker("option", "maxDate", selectedDate);
        }
    });
});