DateTimeItem: the time value always increases by 1 hour

[pavo123]

Hi Isomorphic,

I have a problem with DateTimeItem for mobile.

SmartClient Version: v12.0p_2019-12-14/PowerEdition Deployment (built 2019-12-14)
Google Chrome Version 79.0.3945.117 (Official Build) (64-bit)

When exiting a DateTimeItem, the time value always increases by 1 hour.

package com.smartgwt.sample.client;

import com.google.gwt.core.client.EntryPoint;
import com.smartgwt.client.core.KeyIdentifier;
import com.smartgwt.client.types.Alignment;
import com.smartgwt.client.util.Page;
import com.smartgwt.client.util.PageKeyHandler;
import com.smartgwt.client.util.SC;
import com.smartgwt.client.widgets.IButton;
import com.smartgwt.client.widgets.Window;
import com.smartgwt.client.widgets.events.ClickEvent;
import com.smartgwt.client.widgets.events.ClickHandler;
import com.smartgwt.client.widgets.form.DynamicForm;
import com.smartgwt.client.widgets.form.fields.DateTimeItem;
import com.smartgwt.client.widgets.layout.VLayout;

public class BuiltInDS extends VLayout implements EntryPoint {
    private IButton recreateBtn;

    public void onModuleLoad() {
        KeyIdentifier debugKey = new KeyIdentifier();
        debugKey.setCtrlKey(true);
        debugKey.setKeyName("D");

        Page.registerKey(debugKey, new PageKeyHandler() {
            public void execute(String keyName) {
                SC.showConsole();
            }
        });

        setWidth100();
        setHeight100();

        recreateBtn = new IButton("Recreate");
        recreateBtn.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                new MyWindow().show();
            }
        });
        addMember(recreateBtn);
        new MyWindow().show();
        draw();
    }

    private class MyWindow extends Window {
        public MyWindow() {
            setWidth(400);
            setHeight(300);
            setMembersMargin(0);
            setModalMaskOpacity(70);
            setShowMinimizeButton(false);
            setIsModal(true);
            setShowModalMask(true);
            centerInPage();

            CustomDateTimeItem dti1 = new CustomDateTimeItem();
            CustomDateTimeItem dti2 = new CustomDateTimeItem();
            DynamicForm dF = new DynamicForm();
            dF.setFields(dti1, dti2);
            setMembers(dF);
        }
    }

    private class CustomDateTimeItem extends DateTimeItem {
        public CustomDateTimeItem() {
            setWidth("100%");
            setTitleColSpan(1);
            setTextAlign(Alignment.CENTER);
            setAlign(Alignment.LEFT);
            setShowPickerIcon(true);
            setUseTextField(true);
            setShowHintInField(true);
            setBrowserInputType("datetime");
        }
    }
}

Best regards
Pavo

[Isomorphic]

The issue is related to round trip conversion of date from/to UTC. A fix has been committed and will be available in nightly builds starting with Jan 30.

Regards,
Isomorphic Software

[pavo123]

Hi Isomorphic,

we cannot upgrade the smartGWT version without testing the functionality of our software (it takes days). We also don't have time for that right now.
But it's very important to me that this works.

Can you please suggest me a workaround for this problem that will work with smartGWT version v12.0p_2019-12-14.

I tried this one DateTimeItem: setValue() doesn't work as expected but it doesn't work. After upgrading smartGWT version I would delete this code.
I need workaround that will work with my current smartGWT version, it doesn't matter if it won't work with the new smartGWT version.

Best regards
Pavo

[Isomorphic]

If you don't setBrowserInputType(), you shouldn't see any issues. If you want to use that feature, you'll have to update because there was a framework bug that had to be fixed.

[Blama]

Hi Isomorphic,

any other approach - perhaps with different controls? What about the setValue() thing? Anything to work around this one?

Use case is that we need to enter date and time on mobile - not necessarily as DateTimeItem, but of course some native "Spinner" would be nice.

Thank you & Best regards
Blama

[Isomorphic]

Both fixes required framework changes - however, we may be able to provide a patch - we'll update here shortly.

[Isomorphic]

To clarify, this fix has already been applied to version 12.0. You do not need to update to a new version (12.1d) to get it. Just go to smartclient.com/builds to get the latest patched build.

[Blama]

Hi Isomorphic,

of course, I got that. The question is if we can work around it somehow, with some handlers, different controls, etc. while staying on our Dec, 14th 2019 12.0p version.

We don’t have automated testing and regressions do happen.

Best regards
Blama

[Isomorphic]

As indicated above, get rid of browserInputType.

[Blama]

Ok, will try that on Monday.

[pavo123]

Hi Isomorphic,

if I get rid of "browserInputType", then only date is shown. But in my case time is mandatory, because I'm adding two Items: "Metting from" and "Metting to". Do you have some other hint? I would be very grateful if you have it!

Best regards
Pavo

[Isomorphic]

That doesn't seem possible - we just tested your code without the setBrowserInputType() call, and it seems to work as expected - you might prove it to yourself by calling setUseMask(), so you can see the input mask for date and time.

If you don't, perhaps you're binding to a DataSource, and the field in there is a Date field, not Datetime?

[pavo123]

Hi Isomorphic,

I found a workaround. Thank you very much for your help!
Various Controls XML

isc.DynamicForm.create({
    ID: "dateForm",
    width: 620,
    fixedColWidths: true,
    colWidths: [190, "*"],
    isGroup: true,
    groupTitle: "Date Controls",
    fields: [{
            name: "dateItem",
            title: "Date useTextField: false",
            editorType: "DateItem",
            useTextField: false
        },
        {
            name: "dateItem2",
            title: "Date useTextField: true",
            editorType: "DateItem",
            useTextField: true
        },
        {
            name: "dateTimeItem",
            title: "Datetime useTextField: false",
            editorType: "DateTimeItem",
            type: "datetime",
            useTextField: false,
        },
        {
            name: "dateTimeItem2",
            title: "Datetime useTextField: true",
            editorType: "DateTimeItem",
            type: "datetime",
            useTextField: true
        },
        {
            name: "timeItem",
            title: "Time useTextField: false",
            editorType: "TimeItem",
            useTextField: false
        },
        {
            name: "timeItem2",
            title: "Time useTextField: true",
            editorType: "TimeItem",
            useTextField: true
        }
    ]
});

Best regards
Pavo