javascript - Liferay <liferay-ui:input-date> control - Stack Overflow

admin管理员组

文章数量:1312888

Hy all,

I'm new to Liferay and I making some porting from jsp to Liferay portal.

If I have a portlet jsp with two date in it like: FromDate ToDate and use two different liferay-ui:input-date one for each date field like:

    ...
<%-- From DATE --%>
<tr>
    <td>
        From date :
    </td>
    <td>
        <liferay-ui:input-date
            dayParam='<%= "strDataRegDa" + "Day" %>'
            dayValue="<%=Integer.parseInt(strDataRegDa.substring(0,2))%>"
            dayNullable="<%= false %>"
            monthParam='<%= "strDataRegDa" + "Month" %>'
            monthValue="<%=(Integer.parseInt(strDataRegDa.substring(3,5))) -1 %>"
            monthNullable="<%= false %>"
            yearParam='<%= "strDataRegDa" + "Year" %>'
            yearValue="<%=Integer.parseInt(strDataRegDa.substring(6))%>"
            yearNullable="<%= false %>"
            yearRangeStart="<%= 1980 %>"
            yearRangeEnd="<%= 2050 %>"
            firstDayOfWeek="<%= Calendar.MONDAY - 1 %>"
            imageInputId='<%= "ceremonyDate"%>'
            disabled="false" >
        </liferay-ui:input-date>
    </td>
</tr>

<%-- To DATE --%>
<tr>
    <td>
        To date :
    </td>
    <td>
        <liferay-ui:input-date
            dayParam='<%= "strDataRegA" + "Day" %>'
            dayValue="<%=Integer.parseInt(strDataRegA.substring(0,2))%>"
            dayNullable="<%= false %>"
            monthParam='<%= "strDataRegDa" + "Month" %>'
            monthValue="<%=(Integer.parseInt(strDataRegA.substring(3,5))) -1 %>"
            monthNullable="<%= false %>"
            yearParam='<%= "strDataRegDa" + "Year" %>'
            yearValue="<%=Integer.parseInt(strDataRegA.substring(6))%>"
            yearNullable="<%= false %>"
            yearRangeStart="<%= 1980 %>"
            yearRangeEnd="<%= 2050 %>"
            firstDayOfWeek="<%= Calendar.MONDAY - 1 %>"
            imageInputId='<%= "ceremonyDate"%>'
            disabled="false" >
        </liferay-ui:input-date>
    </td>
</tr>
....

is there a way to control that ToDare is >= FromDate ?

With pure jsp I can do that via javascript.

But with Liferay how can achieve that ?

Hy all,

I'm new to Liferay and I making some porting from jsp to Liferay portal.

If I have a portlet jsp with two date in it like: FromDate ToDate and use two different liferay-ui:input-date one for each date field like:

    ...
<%-- From DATE --%>
<tr>
    <td>
        From date :
    </td>
    <td>
        <liferay-ui:input-date
            dayParam='<%= "strDataRegDa" + "Day" %>'
            dayValue="<%=Integer.parseInt(strDataRegDa.substring(0,2))%>"
            dayNullable="<%= false %>"
            monthParam='<%= "strDataRegDa" + "Month" %>'
            monthValue="<%=(Integer.parseInt(strDataRegDa.substring(3,5))) -1 %>"
            monthNullable="<%= false %>"
            yearParam='<%= "strDataRegDa" + "Year" %>'
            yearValue="<%=Integer.parseInt(strDataRegDa.substring(6))%>"
            yearNullable="<%= false %>"
            yearRangeStart="<%= 1980 %>"
            yearRangeEnd="<%= 2050 %>"
            firstDayOfWeek="<%= Calendar.MONDAY - 1 %>"
            imageInputId='<%= "ceremonyDate"%>'
            disabled="false" >
        </liferay-ui:input-date>
    </td>
</tr>

<%-- To DATE --%>
<tr>
    <td>
        To date :
    </td>
    <td>
        <liferay-ui:input-date
            dayParam='<%= "strDataRegA" + "Day" %>'
            dayValue="<%=Integer.parseInt(strDataRegA.substring(0,2))%>"
            dayNullable="<%= false %>"
            monthParam='<%= "strDataRegDa" + "Month" %>'
            monthValue="<%=(Integer.parseInt(strDataRegA.substring(3,5))) -1 %>"
            monthNullable="<%= false %>"
            yearParam='<%= "strDataRegDa" + "Year" %>'
            yearValue="<%=Integer.parseInt(strDataRegA.substring(6))%>"
            yearNullable="<%= false %>"
            yearRangeStart="<%= 1980 %>"
            yearRangeEnd="<%= 2050 %>"
            firstDayOfWeek="<%= Calendar.MONDAY - 1 %>"
            imageInputId='<%= "ceremonyDate"%>'
            disabled="false" >
        </liferay-ui:input-date>
    </td>
</tr>
....

is there a way to control that ToDare is >= FromDate ?

With pure jsp I can do that via javascript.

But with Liferay how can achieve that ?

• javascript
• jsp
• liferay

Share Improve this question Follow edited May 21, 2015 at 15:33 VC1 1,68644 gold badges2525 silver badges4343 bronze badges asked Nov 30, 2011 at 8:06 dbrembilladbrembilla 15711 gold badge33 silver badges88 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

In our project I used manual Validation for the two dates in my Portlet Class for the dates. I had also searched but couldn't get anything which liferay provides. Through javascript don't know if Alloy UI provides something.

So in my humble opinion liferay does not provide any functionality for validating the two dates (atleast as of now), as can be seen from some out-of-box liferay portlets which does not have this validation like for example the Announcements-portlet with display-date and expiry-date.

Maybe you need something like custom validator. Try this in your jsp:

<liferay-ui:input-date name="fromDate"></liferay-ui:input-date>
<liferay-ui:input-date name="toDate">
    <aui:validator name="custom" errorMessage="your custom validation msg">
    function(val, fieldNode, ruleValue) 
    {
        // No error when toDate is blank
        if(val == ""){
            return true;
        }
        var fromDate;
        var toDate;
        var result=false;

        var fromDateObj = document.getElementById("<portlet:namespace />fromDate");
        if(fromDateObj) {
            fromDate = new Date(fromDateObj.value);
        }else{
            result = false;
        }

        toDate = new Date(val);

        if(fromDate && toDate){
            result = (toDate.getTime() > fromDate.getTime());
        }else{
            result = false;
        }

        return result;
    } 
    </aui:validator>
</liferay-ui:input-date>

Hope this helps you.

Thanks.

My answer is based on AGis answer. If you use e.g. the German language settings, the liferay-ui:input-date formats its value into DD/MM/YYYY instead of MM/DD/YYYY (I still don't know how to change the format of input-date..). That means fromDate = new Date(fromDateObj.value) does not work. So I do a workaround, access day, month and year directly and pare the values manually. An advantage of this solution might be that you are independent of the format that input-date uses:

<liferay-ui:input-date
        name="startDate"
        yearParam="startDateYear"
        monthParam="startDateMonth"
        dayParam="startDateDay"
/>
<liferay-ui:input-date
        name="endDate"
        yearParam="endDateYear"
        monthParam="endDateMonth"
        dayParam="endDateDay"
>
    <aui:validator name="endDateAfterStartDate" errorMessage="some-error-message">
        function(value, fieldNode, ruleValue) {
            var result = false;

            var startDateYear = parseInt(document.getElementById("<portlet:namespace />startDateYear").value);
            var startDateMonth = parseInt(document.getElementById("<portlet:namespace />startDateMonth").value);
            var startDateDay = parseInt(document.getElementById("<portlet:namespace />startDateDay").value);
            var endDateYear = parseInt(document.getElementById("<portlet:namespace />endDateYear").value);
            var endDateMonth = parseInt(document.getElementById("<portlet:namespace />endDateMonth").value);
            var endDateDay = parseInt(document.getElementById("<portlet:namespace />endDateDay").value);

            if (endDateYear > startDateYear) {
                result = true;
            } else if (endDateYear == startDateYear) {
                if (endDateMonth > startDateMonth) {
                    result = true;
                } else if (endDateMonth == startDateMonth) {
                    if (endDateDay > startDateDay) {
                        result = true;
                    }
                }
            }

            return result;
        }
    </aui:validator>
</liferay-ui:input-date>

Maybe that helps someone.

本文标签： javascriptLiferay ltliferayuiinputdategt controlStack Overflow