Date Picker

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

Hi All,

I am new to Liferay. And I am currently working on implementing a Date Picker for my project.

I tried 2 ways, they are as follows:
First Method:
In JSP Page:
<%
Enewsletter enewsletter = (Enewsletter) request.getAttribute("enewsletter");
if (enewsletter == null) {
enewsletter = new EnewsletterImpl();
Calendar now = CalendarFactoryUtil.getCalendar();
now.set(2011, 1, 1);
enewsletter.setPublishDate(now.getTime());
enewsletter.setUnPublishDate(now.getTime());
}
%>

<% Calendar unpubDate = CalendarFactoryUtil.getCalendar();
unpubDate.setTime(enewsletter.getUnPublishDate());
%>
<p> <aui:input model="<%=Enewsletter.class %>" bean="<%=enewsletter %>" label="UnPublish Date" name="unPublishDate" value="<%=unpubDate %>"></aui:input> </p>

In the Portlet Class:

int unPublishDateMonth = ParamUtil.getInteger(actionRequest,"unPublishDateMonth");
int unPublishDateDay = ParamUtil.getInteger(actionRequest,"unPublishDateDay");
int unPublishDateYear = ParamUtil.getInteger(actionRequest,"unPublishDateYear");

I checked the above the values in the portlet class were all Zero, I could not retrieve the Day, month and year

Second Method:
<liferay-ui:input-date yearValue="<%= year %>"
dayValue="<%= day %>"
monthValue="<%= month %>"
yearRangeStart="1900"
yearRangeEnd="2090"
dayParam="UnPubDay"
monthParam="UnPubMonth"
yearParam="UnPubYear"/>
For this method I do not know how to get the date values in the portlet class.

Please kindly advice, I think I am missing something here.

Regards,
Mano

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

If you an Sample Date Picker Implementation. Please share , I can refer to it and learn.

Regards,
Mano

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

Hi All,

I got my problem resolved :-) !!!

it was due to enctype="multipart/form-data" in the form that was cuasing the date picker values not appearing in the actionRequest.

Regards,
mano

[Artur Pirozhkov, módosítva 12 év-val korábban]

Hi mano

I am interested in the same question

how did you imported the class Enewsletter, which library is it from?

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

Hi Artur,

The Enesletter class is my custom entity Object and not a liferay standard library .


Regards,
Mano

[Alberto Gonzalez, módosítva 12 év-val korábban]

You receive them like params, isn´t it?

[Jhansi Rani, módosítva 12 év-val korábban]

Hi Friends, I am not getting the calendar.
Can you please share the code to implement a aui datepicker in custom portlet.

Thanks & Regards
Jhansi Rani P.

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

Hi All,

Below is the Sample Code Which I implemented. There could be better Implementation than this.

// In The JSP Page 

<%
   Calendar cal = Calendar.getInstance();  
%>

<table>
 			<tbody><tr>
        	<td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">From Date</td>
        	<td align="left" style="padding-left:23px;">
			<aui:fieldset>
				<aui:field-wrapper>
				    <liferay-ui:input-date dayParam="fromDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="fromDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="fromDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%= cal.get(Calendar.YEAR) + 60 %>" />
				</aui:field-wrapper>
			</aui:fieldset>
			</td>
			</tr>
		</tbody></table>	        
        
        
        	<table>
        	<tbody><tr>
        	<td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">To Date</td>
        	<td align="left" class="greyText" style="padding-left:36px;">
        	<aui:fieldset>
        		<aui:field-wrapper>
				    <liferay-ui:input-date dayParam="toDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="toDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="toDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%=cal.get(Calendar.YEAR) + 60 %>" />
				</aui:field-wrapper>
			</aui:fieldset></td>
			</tr>
			</tbody></table>
        



//Inside Portlet Class:

				// Getting the Date Range
					fromDay = ParamUtil.getInteger(actionRequest, "fromDateDay");
					fromMonth = ParamUtil.getInteger(actionRequest, "fromDateMonth");
					fromYear = ParamUtil.getInteger(actionRequest, "fromDateYear");
					toDay = ParamUtil.getInteger(actionRequest, "toDateDay");
					toMonth = ParamUtil.getInteger(actionRequest, "toDateMonth");
					toYear = ParamUtil.getInteger(actionRequest, "toDateYear");

		// Get Date Range 
					fromDate = getDate(fromMonth, fromDay, fromYear);
					toDate = getDate(toMonth, toDay, toYear);


		//To get the Actual Date Make a Call to the Method Below:

		public static Date getDate(int month, int day, int year){
				
				Date finalDate = null;
				
				try {
					finalDate = PortalUtil.getDate(month, day, year, new PortalException());
				} catch (PortalException e) {
					// TODO Auto-generated catch block
					e.printStackTrace();
					return finalDate = null;
				}
				
				return finalDate;
			}

This is my Implementation, there could be better ways of doing it.


Regards,
Mano

[Jhansi Rani, módosítva 12 év-val korábban]

Thank you for quick reply.

Regards
Jhansi

[sunil G, módosítva 12 év-val korábban]

Your Date picker code was very helpful

Thanks.

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

sunil G:

Your Date picker code was very helpful

Thanks.

You are welcome

Regards,
Mano

[Rufus Pwner, módosítva 12 év-val korábban]

Hi, thanks for your code snippet. It is really helpful, but the getInteger methods in the portlet all return "0".

This is my JSP Code, which is quite the same as your

<table>
             <tbody><tr>
            <td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">From Date</td>
            <td align="left" style="padding-left:23px;">
            <aui:fieldset>
                <aui:field-wrapper>
                    <liferay-ui:input-date dayParam="fromDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="fromDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="fromDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%= cal.get(Calendar.YEAR) + 60 %>" />
                </aui:field-wrapper>
            </aui:fieldset>
            </td>
            </tr>
        </tbody></table>            
            <table>
            <tbody><tr>
            <td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">To Date</td>
            <td align="left" class="greyText" style="padding-left:36px;">
            <aui:fieldset>
                <aui:field-wrapper>
                    <liferay-ui:input-date dayParam="toDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="toDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="toDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%=cal.get(Calendar.YEAR) + 60 %>" />
                </aui:field-wrapper>
            </aui:fieldset></td>
            </tr>
            </tbody></table>

Portlet Code:

package com.test;

import java.io.IOException;
import java.util.Date;

import javax.portlet.ActionRequest;
import javax.portlet.ActionResponse;
import javax.portlet.PortletException;

import com.liferay.portal.kernel.exception.PortalException;
import com.liferay.portal.kernel.util.ParamUtil;
import com.liferay.portal.util.PortalUtil;
import com.liferay.util.bridges.mvc.MVCPortlet;

public class VeranstaltungsPortlet extends MVCPortlet {

	public void machen(ActionRequest actionRequest, ActionResponse actionResponse)
	throws IOException, PortletException{
	      // Getting the Date Range
      int  fromDay = ParamUtil.getInteger(actionRequest, "fromDateDay");
      int  fromMonth = ParamUtil.getInteger(actionRequest, "fromDateMonth");
        int fromYear = ParamUtil.getInteger(actionRequest, "fromDateYear");
     int   toDay = ParamUtil.getInteger(actionRequest, "toDateDay");
        int toMonth = ParamUtil.getInteger(actionRequest, "toDateMonth");
        int toYear = ParamUtil.getInteger(actionRequest, "toDateYear");
        System.out.println("FromDay: "+fromDay+" FromMonth: "+fromMonth+" FromYear: "+fromYear);
        System.out.println("FromDay: "+toDay+" FromMonth: "+toMonth+" FromYear: "+toYear);
// Get Date Range
        Date fromDate = getDate(fromMonth, fromDay, fromYear);
        Date toDate = getDate(toMonth, toDay, toYear);
	}

//To get the Actual Date Make a Call to the Method Below:

public static Date getDate(int month, int day, int year){
   
    Date finalDate = null;
   
   
        try {
			finalDate = PortalUtil.getDate(month, day, year, new PortalException());
		} catch (PortalException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
   
   
    return finalDate;
}
	}

Do you have any idea why?
I am using LR 6.1 RC.

[MANOVINAYAK AYYAPPAN, módosítva 12 év-val korábban]

Hi Rufus,

I believe you have included the below Calendar Object Instance in your code.

<%
   Calendar cal = Calendar.getInstance(); 
%>

And by any chance does this Date Picker falls within a form which has a enctype="multipart/form-data".

Is it Something as below ?

<aui:form method="post" name="fm" enctype="multipart/form-data"> 
<table>
             <tbody><tr>
            <td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">From Date</td>
            <td align="left" style="padding-left:23px;">
            <aui:fieldset>
                <aui:field-wrapper>
                    <liferay-ui:input-date dayParam="fromDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="fromDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="fromDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%= cal.get(Calendar.YEAR) + 60 %>" />
                </aui:field-wrapper>
            </aui:fieldset>
            </td>
            </tr>
        </tbody></table>            
            <table>
            <tbody><tr>
            <td align="left" class="greyText" style="padding-top:10px; vertical-align:top;">To Date</td>
            <td align="left" class="greyText" style="padding-left:36px;">
            <aui:fieldset>
                <aui:field-wrapper>
                    <liferay-ui:input-date dayParam="toDateDay" dayValue="<%= cal.get(Calendar.DATE) %>" disabled="<%= false %>" firstDayOfWeek="<%= cal.getFirstDayOfWeek() - 1 %>" monthParam="toDateMonth" monthValue="<%= cal.get(Calendar.MONTH) %>" yearParam="toDateYear" yearValue="<%= cal.get(Calendar.YEAR) %>" yearRangeStart="<%= cal.get(Calendar.YEAR) - 60 %>" yearRangeEnd="<%=cal.get(Calendar.YEAR) + 60 %>" />
                </aui:field-wrapper>
            </aui:fieldset></td>
            </tr>
            </tbody></table>
</aui:form>

If yes then it is the nature of "multipart/form-data" form request processing.

Regards,
Mano

[Rufus Pwner, módosítva 12 év-val korábban]

I am sorry that i bothered you. I did not use the
<aui:form method="post" name="fm" enctype="multipart/form-data">
The only thing I did not do was to wrap my table with an aui:form at all.... stupid me.
Now that i have surrounded it with an aui:form tag it works like a charm
Thank you a lot for your advice and code snippet!
Keep up the good work!

[mohammad azaruddin, módosítva 10 év-val korábban]

Hi


Use of PortalUtil.getDate is deprecated.Any alternative method

HTH