Realtime or confirmed

[chisholmd]

Ok, here is another idea. Maybe the control should have one set of values that update as the user selects values...like it is now, and another set of values that only updates if the user confirms their selection.

For example, right now if I place this control in my document it displays the current datetime, if the user clicks on it, each time they increment the day, hour, or minute, the displayed date updates and the value of the control updates.

This causes a couple of problems. First, lets imagine that I am using this control to allow the user to modify a search parameter. If I observe changes to the controls date/time. Then every time the user increments the time using the arrows, then my search refires. Instead of binding directly to the control I could bind to a different variable and then update it if the user confirms their selection...but right now there is only "close". And if they cancel I have to restore the displayed value of the control back to the value before they started clicking around.

Here is my suggestion. What if the control exposed the "date" "time" AND a "confirmedDate" and "confirmedTime".

When the control loads these are the same values. When the user opens up the picker and starts increment, only the "date" and "time" change. The user should have a confirm and a cancel option. If they confirm, then "confirmedDate" is set to the value of "date". But if they cancel, then "date" is set to "confirmedDate".

"Date" and "Time" remain the variables that are displayed in the control.

The problem for me right now, is that I can manage all this from outside of the control except the control provides no "cancel" option. And it takes a few more variables to manage it correctly to keep the live values and the displayed values in sync.

Hope that all made sense.

[binbalenci]

I double this as well. Having a confirm button but as picking date already updating it is just pure chaotic.

[fooloomanzoo]

@chisholmd @binhbbui411 A workaround could be to just search when the opened-attribute is false. But in the next version there will be a no-mediation attribute, if you like no mediation (like now) and as default that behavior, you mean. But it will always be the date, time, datetime or value attribute that notify because of simplifying the element and keeping the same accessibility for the native picker. The other attributes may still change (year, month, day, ...).

[chisholmd]

In datetime-mixin.html I added this:

confirmedDate: { type: String, reflectToAttribute: true, notify: true },

      /**
       * the selected time (format: iso8061)
       */
      confirmedTime: {
        type: String,
        reflectToAttribute: true,
        notify: true
      },

Then in input-picker-pattern.html static get _buttonTemplate() { return ${super._buttonTemplate || ''} <svg class="icon button close" hidden$="[[!opened]]" viewBox="0 0 24 24" on-click="myclose"><g><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></g></svg> <svg class="icon button close" hidden$="[[!opened]]" viewBox="0 0 24 24" on-click="mycancel"><g><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></g></svg> ; } AND myclose(e){ this.confirmedDate = this.date; this.confirmedTime = this.time; this.close(e); } mycancel(e){ this.date = this.confirmedDate this.time = this.confirmedTime this.close(e); }

  myclose(e){
    this.confirmedDate = this.date;
    this.confirmedTime = this.time;
    this.close(e); 
  }
  mycancel(e){

    this.close(e);
  }

That did the trick The user can select a date and a time and click the checkmark to confirm or the x to cancel. I can choose to bind to confirmedDate and or just Date so the control can still do both.

[chisholmd]

Sry I should have used mark down better

[fooloomanzoo]

@chisholmd In the newest version 2.4.2 I implemented both. To deactivate confirming set auto-confirm-attribute, so that confirmed-datetime, confirmed-date and confirmed-time are auto-confirmed, else they are handled in the way you expect it. Reason is that this behavior might not be wanted by everyone, but this way it is more a simular behavior to the native picker. There are also now separate inputs for datetime, date and time (without a picker and any confirmation). Regards!

[chisholmd]

Coolness :)