Alloy Showcase - Liferay Faces

FacesContextHelperUtil

alloy:inputDate

InputDate is a UIInput component that renders an <input type="text"> element and a calendar popover with selectable dates. The component attempts to automatically convert the submitted value to a Date via a built-in DateTimeConverter.

General Usage

The showOn attribute specifies which events will popup the calendar. When nativeWhenMobile=true (the default), then the component will render an HTML5 <input type="date" /> element on small/mobile displays in order to enable selection of a date with the mobile device's native UI.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:alloy="http://liferay.com/faces/alloy"
    xmlns:c="http://xmlns.jcp.org/jsp/jstl/core" xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <!--  Example 1: Specifying showOn="focus" (the default) -->
    <alloy:form>
        <alloy:field label="#{i18n['birthday']}">
            <alloy:inputDate id="birthday" pattern="MM/dd/yyyy"
                required="#{showcaseModelBean.selectedComponent.required}"
                value="#{inputDateModelBean.birthday}" />
            <alloy:message for="birthday" />
        </alloy:field>
        <hr />
        <alloy:commandButton render="@form" value="#{i18n['submit']}" />
        <alloy:outputText id="modelValue" value="#{inputDateModelBean.birthday}">
            <f:convertDateTime pattern="MM/dd/yyyy" />
        </alloy:outputText>
    </alloy:form>
    <c:if test="#{!browserSniffer.mobile}">
        <!-- Example 2: Specifying showOn="button" -->
        <alloy:form>
            <alloy:field label="#{i18n['birthday']}">
                <alloy:inputDate id="birthday" pattern="MM/dd/yyyy" showOn="button"
                    value="#{inputDateModelBean.birthday}" />
                <alloy:message for="birthday" />
            </alloy:field>
            <hr />
            <alloy:commandButton render="@form" value="#{i18n['submit']}" />
            <alloy:outputText id="modelValue" value="#{inputDateModelBean.birthday}">
                <f:convertDateTime pattern="MM/dd/yyyy" />
            </alloy:outputText>
        </alloy:form>
    </c:if>
    <c:if test="#{!browserSniffer.mobile}">
        <!-- Example 3: Specifying showOn="both" -->
        <alloy:form>
            <alloy:field label="#{i18n['birthday']}">
                <alloy:inputDate id="birthday" pattern="MM/dd/yyyy" showOn="both"
                    value="#{inputDateModelBean.birthday}" />
                <alloy:message for="birthday" />
            </alloy:field>
            <hr />
            <alloy:commandButton render="@form" value="#{i18n['submit']}" />
            <alloy:outputText id="modelValue" value="#{inputDateModelBean.birthday}">
                <f:convertDateTime pattern="MM/dd/yyyy" />
            </alloy:outputText>
        </alloy:form>
    </c:if>
</ui:composition>
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
@ManagedBean
@RequestScoped
public class InputDateModelBean {
    private Date birthday;
    private Locale locale;
    private Date maxDate;
    private Date minDate;
    public Date getBirthday() {
        return birthday;
    }
    public String getFormattedMaxDate() {
        DateFormat dateFormat = new SimpleDateFormat("MM/dd/yyyy");
        return dateFormat.format(getMaxDate());
    }
    public String getFormattedMinDate() {
        DateFormat dateFormat = new SimpleDateFormat("MM/dd/yyyy");
        return dateFormat.format(getMinDate());
    }
    public Locale getLocale() {
        if (locale == null) {
            locale = new Locale("ja", "JA");
        }
        return locale;
    }
    public Date getMaxDate() {
        if (maxDate == null) {
            Calendar calendar = new GregorianCalendar();
            calendar.add(Calendar.MONTH, 2);
            maxDate = calendar.getTime();
        }
        return maxDate;
    }
    public Date getMinDate() {
        if (minDate == null) {
            Calendar calendar = new GregorianCalendar();
            calendar.add(Calendar.MONTH, -2);
            minDate = calendar.getTime();
        }
        return minDate;
    }
    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }
}
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Liferay Faces Alloy 4.1.1 + Liferay Faces Bridge Implementation 5.0.0 + Showcase Common 4.0.0 + Liferay Faces Util 3.4.1 + Mojarra 2.2.20

Nodo: liferay-75cdbc7df5-mdsvm:8080: