PrimeFaces - Date Range Picker with second selectable date always starts from the first one

In the last example, we saw how to implement a date picker. We implemented a custom JSF Validator to restrict the user to select the second date to be more than or equal to the first date. In this example, we will show how to restrict second calendar's minimum value to be always more than the first calendar selected date. In this case, we will need no date validations.

JSF page

src/main/webapp/index.xhtml

<h:body>
    <h2>Primefaces Date Range Picker example</h2>
    <p:outputPanel id="mainPanel">
        <p:outputLabel for="dateSelectBtn" value="#{dateRange.dateRangeString}"/>
    </p:outputPanel>

    <p:commandButton id="dateSelectBtn" value="Select new date range" type="button"
                     onclick="PF('dateRangeDlg').show();"/>
    <p:dialog closable="false"
              header="Date Range Picker" resizable="false"
              widgetVar="dateRangeDlg" minHeight="40" modal="true">
        <p:outputPanel>
            <h:form>
                <p:calendar id="idStartDate" readonlyInput="true"
                            value="#{dateRange.startDate}">
                    <p:ajax event="dateSelect" update="idEndDate"/>
                </p:calendar>
                <p:calendar id="idEndDate" readonlyInput="true"
                            value="#{dateRange.endDate}"
                            mindate="#{dateRange.startDate}">
                    <p:ajax event="dateSelect"/>
                </p:calendar>
                <br/>
                <p:commandButton value="Close" icon="ui-icon-close"
                                 update=":mainPanel"
                                 onclick="PF('dateRangeDlg').hide()"/>
            </h:form>
        </p:outputPanel>
    </p:dialog>
</h:body>

The manage bean

@ManagedBean(name = "dateRange")
@SessionScoped
public class DateRangeBean {
  private Date startDate;
  private Date endDate;
  private DateFormat formatter = new SimpleDateFormat("MM-dd-yyyy");

  public DateRangeBean() {
      Calendar c1 = Calendar.getInstance();
      endDate = c1.getTime();
      Calendar c2 = Calendar.getInstance();
      c2.set(Calendar.YEAR, c1.get(Calendar.YEAR));
      c2.set(Calendar.DAY_OF_YEAR, 1);
      startDate = c2.getTime();
  }

  public Date getStartDate() {
      return startDate;
  }

  public void setStartDate(Date startDate) {
      this.startDate = startDate;
      if(endDate.before(startDate)){
          endDate = startDate;
      }
  }

  public Date getEndDate() {
      return endDate;
  }

  public void setEndDate(Date endDate) {
      this.endDate = endDate;
  }

  public String getDateRangeString() {
      return String.format("From: %s To: %s%n",
              formatter.format(startDate), formatter.format(endDate));
  }
}

mvn tomcat7:run-war

Output

Example Project

Dependencies and Technologies Used:

• primefaces 6.1 primefaces
• jsf-api 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
• jsf-impl 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
• datafactory 0.8: Library to generate data for testing.
• JDK 1.8
• Maven 3.3.9