Tribune

Home » Alloy UI » English

Vista Combinata Vista Piatta Vista ad Albero
Discussioni [ Precedente | Successivo ]
toggle
Thomas Berg
aui calendar
30 giugno 2012 10.17
Risposta

Thomas Berg

Punteggio: Regular Member

Messaggi: 134

Data di Iscrizione: 7 settembre 2009

Messaggi recenti

I have used the aui-calendar pretty extensively in Liferay 6.0.5 to "pop-up" a calendar when clicking input elements that are supposed to hold dates.

The below code does not seem to work in Liferay 6.1.0, the calendar is drawn in the top left corner of the browser instead of next to the input element and dates are not set when selecting a date in the calendar. I guess the calendar fails to bind to the input element specified in the attribute "trigger"?

1<aui:script use="aui-calendar">
2    (new A.Calendar({
3       trigger: '#<portlet:namespace/><%= PortletKeys.PARAM_ACTIVATE_DATE %>',
4       dateFormat: '%Y-%m-%d',
5       setValue: true,
6       selectMultipleDates: false
7    }).render());
8</aui:script>


In the examples at http://deploy.alloyui.com/demos/calendar/ there are no input elements...
I believe my use-case is quite common, hopefully I've just missed something obvious, any thoughts on this would be appreciated

Regards
/ Thomas
Muzakir Khan
RE: aui calendar
1 luglio 2012 22.41
Risposta

Muzakir Khan

Punteggio: Regular Member

Messaggi: 112

Data di Iscrizione: 14 marzo 2012

Messaggi recenti

Hi Thomas!
I am attaching a Calendar portlet war file that works in 6.1.. Check out if it helps you.

Kind Regards
Khan
Allegati: Calender-portlet-6.1.0.1.war (18,4k)
Thomas Berg
RE: aui calendar
5 luglio 2012 0.28
Risposta

Thomas Berg

Punteggio: Regular Member

Messaggi: 134

Data di Iscrizione: 7 settembre 2009

Messaggi recenti

Hello Muzakir,

Thanks for your example! It does not work exactly like I need it to but it's a good start!

I think it's a shame that Alloy UI no longer provides this functionality, I really believe it to be a common use-case. For me, the simplicity of using the calendar for input fields was what made me start using AUI in the first place. Now, without proper documentation and motives as to why this has been changed, its' simply frustrating. I don't have time to figure this out so I will use some other library instead.

Thanks again for your effort, Muzakir!

Kind regards
/ Thomas
Thomas Berg
RE: aui calendar
7 luglio 2012 3.49
Risposta

Thomas Berg

Punteggio: Regular Member

Messaggi: 134

Data di Iscrizione: 7 settembre 2009

Messaggi recenti

As frustrated as I was, I just could not give up on AUI that easy emoticon

My use-case is covered by using the DatePicker instead of Calendar: http://deploy.alloyui.com/demos/datepicker/
In retrospective, this feels like a natural move. I just wish someone had told me about the change.

EDIT:
For completeness, here's how I achieve the same with aui-datepicker:

1(new A.DatePicker({
2        trigger: '#trigger1',
3        calendar: {
4            dateFormat: '%Y-%m-%d',
5            selectMultipleDates: false
6        },
7        setValue: true
8    }).render());


Regards
/ Thomas
Hitoshi Ozawa
RE: aui calendar
7 luglio 2012 6.11
Risposta

Hitoshi Ozawa

Punteggio: Liferay Legend

Messaggi: 7949

Data di Iscrizione: 23 marzo 2010

Messaggi recenti

I think the issue you've mention seems to be listed in liferay's issue below even though it's been about 2 years ago.
The problem is it not clear which version of aui is being used in a version of liferay. It may help to keep track of liferay issues.

http://issues.liferay.com/browse/AUI-148?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
Thomas Berg
RE: aui calendar
7 luglio 2012 7.58
Risposta

Thomas Berg

Punteggio: Regular Member

Messaggi: 134

Data di Iscrizione: 7 settembre 2009

Messaggi recenti

Thanks Hitoshi,
Great link, it all makes perfect sense! I should have made some more careful investigations before "lashing out" emoticon

I completely agree that it would be great if there was a clearer notion of which version is actually used in a particular build of Liferay.
I'm upgrading from Liferay 6.0.5 and haven't been following the changes in AUI more than checking alloyui.com (from time to time. The documentation on deploy.alloyui.com/api/ does not reflect the latest release. It's a bit hard to figure things out even though the examples are up to date.

I also feel that it's confusing that there are several places for information about AUI:

  1. http://alloyui.com (not maintained)
  2. alloyui.liferay.com (http://www.liferay.com/community/liferay-projects/alloy-ui/overview)
  3. deploy.alloyui.com


The most recent (official) release is still 1.0.1

Hope to see Nate blog about AUI again, I think his posts have been extremely useful in the past.

Regards,
/ Thomas
Laura Liparulo
RE: aui calendar
15 luglio 2012 14.48
Risposta

Laura Liparulo

Punteggio: Junior Member

Messaggi: 38

Data di Iscrizione: 30 giugno 2012

Messaggi recenti

hi! I'm also trying to make the form with the calendar.. I haven't found a solution with AUI only.. but I've been able to perform the database this way:

 1<aui:form name="caseForm" action="<%=addCaseURL%>" method="post">
 2    <aui:fieldset>
 3        <aui:input name="caseName" label="Case Name" size="45">
 4            <aui:validator name="required" errorMessage="case-required" />
 5        </aui:input>
 6        <aui:select name="volumeId" label="Volume">
 7            <aui:option value="-1">
 8                <liferay-ui:message key="Choose volume" />
 9            </aui:option>
10            <%
11                for (Volume volume : volumes) {
12            %>
13            <aui:option value="<%=volume.getVolumeId()%>">
14                <%=volume.getVolumeName()%>
15            </aui:option>
16            <%
17                }
18            %>
19        </aui:select>
20
21        <b>Date Case </b>
22        <br />
23        <liferay-ui:input-date formName="date" yearRangeStart="1970"
24            yearRangeEnd="2100" yearValue="2010" monthValue="3" dayValue="21"
25            dayParam="d1" monthParam="m1" yearParam="y1" />
26        <br />
27
28        <aui:select name="agePatient" label="Patient Age">
29            <aui:option value="-1">
30                <liferay-ui:message key="Choose age" />
31            </aui:option>
32            <%
33                while (i < 130) {
34            %>
35            <aui:option value="<%=i++%>">
36                <%=i%>
37            </aui:option>
38            <%
39                }
40            %>
41
42        </aui:select>
43
44        <aui:input type="textarea" label="notes" rows="10" cols="30"
45            name="notes" />
46        <aui:button-row>
47            <aui:button type="submit" />
48            <aui:button type="cancel" value="Cancel"
49                onClick="<%=cancelURL.toString()%>" />
50        </aui:button-row>
51    </aui:fieldset>
52</aui:form>


Although the date input is not aui, by editing the label "<b> ...</b> " .. the user interface is ok. this way I could fill the row in the database :-)
parameters are like:
formName="date" in liferay-ui
name="notes" in aui

Now the date is always the current one.. it doesn't get the input from the form
Laura Liparulo
RE: aui calendar
16 luglio 2012 4.06
Risposta

Laura Liparulo

Punteggio: Junior Member

Messaggi: 38

Data di Iscrizione: 30 giugno 2012

Messaggi recenti

I've found a working solution.
you can read my thread : DatePicker AUI/liferayUi
Penny Cooper
RE: aui calendar
17 luglio 2012 2.22
Risposta

Penny Cooper

Punteggio: New Member

Messaggi: 2

Data di Iscrizione: 16 luglio 2012

Messaggi recenti

Hello,
Thomas I think now its working riteemoticon