Expand my Community achievements bar.

SOLVED

DateTime picker not showing up in the complete work item dialog

Avatar

Level 4

I need to allow the author to enter date and time for scheduling the page.

Following the article from forum "Dialog Participant Step in the Touch UI " I have datetime picker in a dialog participant step.

So when i start the workflow in inbox, in the complete step when i click on the button the date time picker is not showing up. Please find below how it appears in inbox

inbox_datetimepickerNotShowingUp.PNG

And from the page where we started the workflow the date time picker is behind the complete work item dialog. please find below

Page_dateTimepickerNotShoiwnUp.PNG

I am using aem 6.3 version and my code for classic UI dialog & touch Ui dialog is as below.

Classic UI:

-------------

<?xml version="1.0" encoding="UTF-8"?>

<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"

    jcr:primaryType="cq:Dialog"

    title="Publish Later"

    touchUiDialogPath="/etc/workflow/cq:dialog"

    xtype="dialog">

    <items jcr:primaryType="cq:WidgetCollection">

        <dateTime

            jcr:primaryType="cq:Widget"

            allowBlank="{Boolean}false"

            fieldLabel="Please schedule the item for publishing"

            name="./jcr:content/datetime"

            xtype="datetime"/>

    </items>

</jcr:root>

Touch UI:

------------

<?xml version="1.0" encoding="UTF-8"?>

<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"

    jcr:primaryType="nt:unstructured"

    jcr:title="Choose Reviewer"

    sling:resourceType="cq/gui/components/authoring/dialog">

    <content

        jcr:primaryType="nt:unstructured"

        sling:resourceType="granite/ui/components/foundation/container">

        <layout

            jcr:primaryType="nt:unstructured"

            sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"

            margin="false"/>

        <items jcr:primaryType="nt:unstructured">

            <column

                jcr:primaryType="nt:unstructured"

                sling:resourceType="granite/ui/components/foundation/container">

                <items jcr:primaryType="nt:unstructured">

                    <schedule

                        jcr:primaryType="nt:unstructured"

                        jcr:title="Scheduling the page"

                        sling:resourceType="granite/ui/components/coral/foundation/form/fieldset">

                        <items jcr:primaryType="nt:unstructured">

                            <absoluteDate

                                jcr:primaryType="nt:unstructured"

                                sling:resourceType="granite/ui/components/foundation/form/datepicker"

                                displayedFormat="D MMMM YYYY hh:mm a"

                                displayTimezoneMessage="{Boolean}true"

                                fieldDescription="Provide current Date/Time to Activate."

                                fieldLabel="Activation Date"

                                minDate="today"

                                name="datetime"

                                type="datetime"/>

                        </items>

                    </schedule>

                </items>

            </column>

        </items>

    </content>

</jcr:root>

Can you please let me out how datetime picker can be seen in inbox & on the page.

1 Accepted Solution

Avatar

Correct answer by
Level 10
7 Replies

Avatar

Community Advisor

HI,

Can you try using Coral UI 3 Datepicker - granite/ui/components/coral/foundation/form/datepicker

Avatar

Level 4

I already tired with coral. Even then the same result.

Avatar

Community Advisor

Hi,

Can you check browser console while opening workflow item from inbox to see if any error?

because I've just tried in AEM 6.3. works fine for me.

Screen Shot 2018-06-11 at 4.11.46 PM.png

Screen Shot 2018-06-11 at 4.13.37 PM.png

Thanks

Arun



Arun Patidar

Avatar

Correct answer by
Level 10

Avatar

Employee

sreekalyanip You need to switch from Coral2 datepicker component [1] to coral3 datepicker component [2].

[1]: granite/ui/components/foundation/form/datepicker

[2]: granite/ui/components/coral/foundation/form/datepicker

Avatar

Level 10

The article i referenced uses coral 3