liferay-ui:input-date restrict the range of enabled date

[Kumar Vivek，修改在11 年前。]

Hi i am using "liferay-ui:input-date "

<liferay-ui:input-date dayparam="Day" dayvalue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstdayofweek="<%= cal.getFirstDayOfWeek() - 1 %>" monthparam="Month" monthvalue="<%= cal.get(Calendar.MONTH) %>" yearparam="Year" yearvalue="<%= cal.get(Calendar.YEAR) %>" yearrangestart="<%= cal.get(Calendar.YEAR) - 60 %>" yearrangeend="<%= cal.get(Calendar.YEAR) + 60 %>"></liferay-ui:input-date>

This is displaying the Date along with the date-picker perfectly and all the dates are enabled . My problem is i want to restrict the enabled date so that the user can only select the range of date from 6 days before today's to today's date . please help me with the code.

[Renata Willi，修改在10 年前。]

Hi Kumar,

I also want to restrict the range of enabled dates, this means the user should be able to select a start date and the max. selectable date should be 3 months from the start date. Have you found a solution to your problem? It would be so great, if you would post your code...

Thanks,
Renata

[Renata Willi，修改在9 年前。]

Hi everyone,

I found a solution to restrict the rage of enabled dates dynamically (In my case I wanted to restrict it to 3 month from the chosen start date, see line 13.). But finally I used the jquery datepicker (http://jqueryui.com/datepicker/#min-max)

My javascript code:

<script>
$(function() {
       $("#fromDate").datepicker({
             minDate: new Date(),
             maxDate: "+1y",
             showOtherMonths: true,
             selectOtherMonths: true,
             dateFormat: "dd M yy",
             onClose: function (selectedDate, instance) {
                    if(selectedDate != "") {
                           $('#toDate').datepicker("option", "minDate", selectedDate);
                           var date = $.datepicker.parseDate(instance.settings.dateFormat, selectedDate, instance.settings);
                           date.setMonth(date.getMonth() + 3);
                           $('#toDate').datepicker("option", "maxDate", date);
                    } else {
                           $('#toDate').datepicker("option", "minDate", new Data());
                    }
             }
       });
       $('#toDate').datepicker({
             minDate: new Date(),
             maxDate: "+1y",
             showOtherMonths: true,
             selectOtherMonths: true,
             dateFormat: "dd M yy",
             onClose: function(selectedDate, instance) {
                    if(selectedDate != "" ){
                           //some code if you want
                    }
             }
       });
});
</script>

Cheers,
Renata