Question Re: Sapui5 date one day missing in Technology Q&A

Sapui5 date one day missing

former_member727508 — Sat, 27 Feb 2021 01:22:13 GMT

I want to show the date I got with DatePicker in a section in a table. But the date is missing 1 day.

I tried many methods:
https://answers.sap.com/questions/409976/sap-webide---ui5---date-field-is-not-showing-corre.html

https://answers.sap.com/questions/323063/date-value-is-getting-reduced-by-one-day-while-pas.html

But it didn't work. What is your suggestion?

Re: Sapui5 date one day missing

boghyon — Sat, 27 Feb 2021 09:50:49 GMT

Since there is no code, I assume the binding info of the DatePicker is not consistent with the binding info of the Text within the table. It's important to keep them consistent.

If the values are bound with a v2.ODataModel, use:

<DatePicker/Text xmlns="sap.m"
  xmlns:core="sap.ui.core"
  core:require="{ ODataDateTimeType: 'sap/ui/model/odata/type/DateTime' }"
  value/text="{
    path: 'EntryDate',
    type: 'ODataDateTimeType',
    constraints: {
      displayFormat: 'Date'
    }
  }"
/>

Please follow the documented guidelines "Dates, Times, Timestamps, and Time Zones" — must-read for OData V2 and OData V4.

Re: Sapui5 date one day missing

former_member727508 — Sat, 27 Feb 2021 10:09:20 GMT

Thanks for your answer but it didn't work. Where am I doing wrong?

<!--It's a input on my fragmnet-->
<f:SimpleForm editable="true" layout="ResponsiveGridLayout" labelSpanXL="3" labelSpanL="3" labelSpanS="12" adjustLabelSpan="false" emptySpanXL="4" emptySpanL="4" emptySpanM="4" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1" singleConteinerFullSize="false">
	<f:content>
		<DatePicker id="dpKayitTarih"/>
	</f:content>
</f:SimpleForm>

<cells>
        <!--My code-->
	<!--<Text text="{ path: 'Tarih', type: 'sap.ui.model.type.Date', formatOptions: { pattern: 'MM/dd/yyyy' } }" />--> 
	<!--Your code-->
	<Text xmlns="sap.m" xmlns:core="sap.ui.core" core:require="{ ODataDateTimeType: 'sap/ui/model/odata/type/DateTime' }" text="{ path: 'Tarih', type: 'ODataDateTimeType', constraints: { displayFormat: 'Date' } }"/>
</cells>

Re: Sapui5 date one day missing

boghyon — Sat, 27 Feb 2021 11:35:36 GMT

sehergurel The value-property in DatePicker should be also bound with the v2.ODataModel as suggested in my answer.

Add the missing relative value-binding (i.e. without a leading slash in the beginning) to your DatePicker, same as with <Text text="{...}"/>.
When the user opens the dialog, create a binding Context with myODataModel.createEntry as described in the topic Creating Entities and set the created Context instance with myDialog.setBindingContext.
After the user enters the data and presses [Send], submit the newly created entry to the backend with myODataModel.submitChanges. The Table will be refreshed automatically with the new data (unless refreshAfterChange is disabled).

The above steps are part of the standard approach of dealing with OData binding.
If it requires too many changes in your code, forget all the above steps and try adding `UTC: true` to your Text.

<Text text="{
  path: 'Tarih',
  type: 'sap.ui.model.type.Date',
  formatOptions: {
    ...,
    UTC: true
  }
}" />

Re: Sapui5 date one day missing

former_member450774 — Sun, 28 Feb 2021 07:01:27 GMT

Hi,

Use the below sample code for reference.

In XML view:

In controller:

var sStartDt = new Date(this.byId("SubmissionDate").getValue());

var sNStartDt = (sStartDt.getFullYear()).toString()+'-' +(sStartDt.getMonth()+ 1).toString()+'-'+(sStartDt.getDate()).toString()+"T00:00:00Z"

Hope it helped you!

Rajesh

Re: Sapui5 date one day missing

former_member654880 — Mon, 01 Mar 2021 07:12:46 GMT

Hi,

You can also refer below code:

Riya

Re: Sapui5 date one day missing

Jagtar — Mon, 01 Mar 2021 12:23:21 GMT

Use binding as below it will work
text="{path: 'date', type: 'sap.ui.model.type.DateTime', formatOptions: { strictParsing: true , UTC: true}}

Issue is coming to you because of time zone .Some time server and client have different time zone

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 12:39:51 GMT

I've tried many methods like this but unfortunately it doesn't work.

<Text text="{path: 'Tarih', type: 'sap.ui.model.type.DateTime', formatOptions: { strictParsing: true , UTC: true}}"/>

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 12:40:33 GMT

Unfortunately it doesn't work 😞

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 12:41:40 GMT

Can you explain in more detail how to I use this?

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 12:42:07 GMT

I've tried many methods like this but unfortunately it doesn't work.

Re: Sapui5 date one day missing

Jagtar — Mon, 01 Mar 2021 13:19:18 GMT

Can you please share your view binding code for date picker.
If you can't share then can you tell if its live binding with odata model or with local json model.

We have same problem in both type binding above given binding will work if its directly binded from odata model.

if you are first copying data to local model then bindind then you need to apply one formatter also .

let us know how you binded?

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 13:39:23 GMT

I used OData Model.

For Tarih (date) field:

My fragment.view

...
<content>
<f:SimpleForm editable="true" layout="ResponsiveGridLayout" labelSpanXL="3" labelSpanL="3" labelSpanS="12" adjustLabelSpan="false" emptySpanXL="4" emptySpanL="4" emptySpanM="4" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1" singleConteinerFullSize="false">
	<f:content>
		<DatePicker id="dpKayitTarih"/>
	</f:content>
</f:SimpleForm>
</content>
<buttons>
	<Button text="{i18n>kaydet}" press="onKayitFrag" type="Transparent"/>
	<Button text="{i18n>geri}" press="onGeriFrag" type="Transparent"/>
</buttons>
...

My Worklist.view

<Table>
...
<items>
	<ColumnListItem>
		<cells>
			<Text text="{path: 'Tarih', type: 'sap.ui.model.type.DateTime', formatOptions: { strictParsing: true , UTC: true}}"/>
		</cells>
	</ColumnListItem>
</items>
</Table>

My controller.js/onKayitFrag

onKayitFrag: function() {
	var that = this;
	var vTarih = sap.ui.getCore().byId("dpKayitTarih").getDateValue();
	var sData = {
		Tarih: vTarih
	};
	sap.ui.core.BusyIndicator.show();
	this.getView().getModel().create("/ListSet", sData, {
		success: function(oData) {
			sap.ui.core.BusyIndicator.hide();
			that._getKayitDialog().close();
			that.onRefresh();
			MessageToast.show("Başarılı");
		},
		error: function(oError) {
			sap.ui.core.BusyIndicator.hide();
			that._getKayitDialog().close();
			MessageToast.show("Başarısız");
		}
	});
}<br>

Re: Sapui5 date one day missing

Jagtar — Mon, 01 Mar 2021 15:24:41 GMT

I am assuming your table is directly binded to odata model

Can you confirm

if data save at backend for 5th date ?

if not then issue when you passing data to backend at time only you missing one day.

var vTarih = sap.ui.getCore().byId("dpKayitTarih").getDateValue();

To Solve this you need to do as below

resolveTimeDifference:function(dateTime){

if (dateTime !== undefined && dateTime !== null && dateTime !== "") {

var offSet = dateTime.getTimezoneOffset();

var offSetVal = dateTime.getTimezoneOffset() / 60;

var h = Math.floor(Math.abs(offSetVal));

var m = Math.floor((Math.abs(offSetVal) * 60) % 60);

dateTime = new Date(dateTime.setHours(h, m, 0, 0)); return dateTime;

}

return null;

var vTarih = this.resolveTimeDifference(sap.ui.getCore().byId("dpKayitTarih").getDateValue());

Re: Sapui5 date one day missing

former_member727508 — Mon, 01 Mar 2021 15:34:00 GMT

You are great. Thank you so much. Problem solved.

Re: Sapui5 date one day missing

former_member450774 — Tue, 02 Mar 2021 08:37:06 GMT

Hi,

Inside simpleform change the datepicker code to below.

<f:SimpleForm editable="true" layout="ResponsiveGridLayout" labelSpanXL="3" labelSpanL="3" labelSpanS="12" adjustLabelSpan="false" emptySpanXL="4" emptySpanL="4" emptySpanM="4" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1" singleConteinerFullSize="false"><f:content><DatePicker id="dpKayitTarih" value="{path: '/SubmissionDate', type:'sap.ui.model.type.Date', formatOptions:{ pattern : 'yyyy-MM-dd'}}" width="auto" displayFormat="medium" enabled="true" visible="true" valueFormat="yyyyMMdd" required="false"/></f:content></f:SimpleForm>

inside the controller , get the date value as below.

var vTarih =  new Date(this.byId("dpKayitTarih").getValue());

or 
var vTarihDat =  new Date(this.byId("dpKayitTarih").getValue(
var vTarih = (vTarihDat.getFullYear()).toString()+'-' +(vTarihDat.getMonth()+ 1).toString()+'-'+(vTarihDat.getDate()).toString()+"T00:00:00Z"

Re: Sapui5 date one day missing

petergilberg — Thu, 16 Dec 2021 08:17:37 GMT

Boghyon's solution definitely works. It's pretty charming you can stick to Databinding and keep away any coding here.

Re: Sapui5 date one day missing

bugrayuksel130 — Sun, 04 Dec 2022 12:56:18 GMT

Thank you so much!