sap.ui.getCore().attachInit(() => sap.ui.require([
"sap/ui/model/odata/v2/ODataModel",
"sap/ui/core/mvc/XMLView",
], function(ODataModel, XMLView) {
"use strict";
const model = new ODataModel({
serviceUrl: [
"https://cors-anywhere.herokuapp.com/", // proxy
"https://services.odata.org/V2/(S(SO46024229))/OData/OData.svc",
].join(""),
defaultBindingMode: "TwoWay",
preliminaryContext: true,
tokenHandling: false, // service does not provide CSRF tokens
});
Promise.all([
sap.ui.getCore().loadLibrary("sap.m", true),
sap.ui.getCore().loadLibrary("sap.ui.unified", true),
]).then(() => XMLView.create({
definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc" height="100%">
<DatePicker id="dp" xmlns="sap.m" width="auto" placeholder="Date"
binding="{
path: '/Products(0)',
parameters: {
select: 'ID,ReleaseDate'
}
}"
value="{
path: 'ReleaseDate',
type: 'sap.ui.model.odata.type.DateTime',
constraints: {
displayFormat: 'Date',
nullable: false
}
}"
/>
</mvc:View>`,
models: model,
afterInit: function() {
const fn = e => e.getSource().getBindingContext().getModel().submitChanges();
this.byId("dp").attachChange(fn);
},
}).then(view => {
const messageManager = sap.ui.getCore().getMessageManager();
messageManager.registerObject(view.placeAt("content"), true);
}));
}));
<script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js"
data-sap-ui-libs="sap.ui.core"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-async="true"
data-sap-ui-compatversion="edge"
data-sap-ui-modules="sap/ui/thirdparty/datajs"
data-sap-ui-xx-waitfortheme="rendering"
></script><body id="content" class="sapUiBody sapUiSizeCompact"></body>
