Let's follow up this discussion at the Neptune Community

(this forum will be kept in read-only mode)

Problems with binding of sap.m.DateTimeInput

I use a DateTimeInput in my footer.

The binding is shown in the screenshot below:

I use the DateTimeInput control on three different pages (using different names).

On one page it works as designed. On the other pages the displayed value is correct and in sync with the backend but the value shown in the popup is out of sync:

 As you can see the 28.10.13 is shown and also the same as the bound value in the model. But when I click on the control in the popup you still see the 25.10.13. Is this from cache anywhere? I cannot find this value in the properties of the control...

Can you please check if you have some javascript errors using the DateTimeInput ?

There are no javascript errors. Maybe I am disturbing the model of the DateTimeInput because the value is bound to the ABAP class and I am changing the selected value both through the DateTimeInput control itself and through Javascript by changing the value of the bound model.

I need to do this because (as you can see in the screenshot) I use two buttons to increase / decrease the date by one day. 

It looks like the default value in the popup of the control is set to today. When I select another value it is changed, too. But when I change the page and return to it later it is set again to today. Seems to be the way the sap.m.DateTimeInput control works.

Are you updating the model data are the value for the DateTimeInput - like this - DateInput.setValue("20130101"); ?

In the buttons < and > I update the data in the model of my Page: 

modelHome.getData().SELECTED_DATE =  dateToSAP(addDays(Footer0Date.getDateValue(), +1));

modelHome.getData().SELECTED_DATE is bound to the DateTimeInput.value

Hi Mark

I have tried your approach, but got the same issue. Updating the model data will not update the component. If you update the date component like: DateInput.setValue("20130101"); You update both the component and model data. Can you try that ?

My use case is a bit complicated, therefore setting the DateInput.setValue() also does not solve my issue.

Currently I change the data in the model data and call an Ajax reload in order to change my displayed data for the newly selected date. If I change the date via DateInput.setValue() then the displayed date in the control is changed (but only the displayed date, not the default date in the control). When I now do an Ajax reload the selected date is overwritten by the old value from the backend.


I have tried different options. When updating the modelData you should use the set new BindingContext. But it will not update the DateTime component. Not sure why, since this is the way we update when recieving data from SAP.


To update the DateTime component i had to use:


In your case you might have one DateTime object not binded to set new date to use in the Ajax call. And not beeing updated when the new data are recieved from SAP.

If you explain more about your problem, i can help out and create a solution in our system.


Ole Andre

Thank you very much for your support. This is really awesome.

Unfortunately our dev system is not accessible at the moment. Maybe I can show you the app in Amsterdam. Then you might understand where the dificulties are. I will also try to rebind the model, maybe this does the trick already.

See you,


To update data to a model, i have used the following method

// Get Data from Model
var localData = modellistOutbox.getData();

// Set new values
localData.WERKS = inPlant.getSelectedKey();
localData.LGORT = inLocation.getSelectedKey();
localData.MATNR = inMATNR.getValue();
localData.QTY   = inQTY.getValue();

// Update Model with new data

The setData will update all the components with binding to the model. 

I also tried it the way you suggest now but the default date in the selector still does not show my last selected value. I think this has to do with the way that I use the DateTimeInput element on three different pages always bound to the identical field in the backend and additionally changing the value per buttons.

If there is an error somewhere I think it lies in my architecture or in the SAPUI5 control. But for the usability of my app it is not important.

Maybe a better approach would be to extend the DateTimeInput control with two buttons that increase/decrease the date by one day but this seems to be much work. At least this is too much for an example app.

Login or Signup to post a comment