<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Date Picker</title>
<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-resourceroots='{"view": "./"}'
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-xx-bindingSyntax="complex">
</script>
<script>
sap.ui.localResources("view"); //get access to view folder
var app = new sap.m.App({
initialPage: "idMain"
});
var page = sap.ui.view({
id: "idMain",
viewName: "view.Main",
type: sap.ui.core.mvc.ViewType.XML
});
app.addPage(page);
app.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
{
"sap.app": {
"id": "sap.m.sample.DatePicker",
"applicationVersion": {
"version": "1.0.0"
}
},
"sap.ui5": {
"rootView": {
"viewName": "sap.m.sample.DatePicker.Group",
"type": "XML",
"async": true
},
"dependencies": {
"libs": {
"sap.ui.core": {},
"sap.ui.layout": {},
"sap.m": {},
"sap.ui.unified": {}
}
},
"config": {
"sample": {
"files": [
"Group.view.xml",
"Group.controller.js",
"manifest.json"
]
}
}
}
}
sap.ui.controller("view.Main", {
onInit: function() {
this.oToDatePicker = this.byId("idToDate");
this.oFromDatePicker = this.byId("idFromDate");
},
handleToDateNavigate: function(oEvent) {
var oSource = oEvent.getSource();
var sFromDate = this.oFromDatePicker.getValue();
var oFromDate = new Date(sFromDate);
var bFromDateValid = this.oFromDatePicker.isValidValue();
// set selected date of date picker calendar to 'From Date' when valid
if (bFromDateValid && sFromDate) {
var oCalendar = oSource._getCalendar();
oCalendar.focusDate(oFromDate);
var oFromDateDateRange = new sap.ui.unified.DateRange()
.setStartDate(oFromDate);
oCalendar.insertSelectedDate(oFromDateDateRange);
}
},
});
<sap.ui.core.mvc:View controllerName="view.Main"
xmlns="sap.m"
xmlns:core="sap.ui.core"
xmlns:sap.ui.core.mvc="sap.ui.core.mvc"
xmlns:f="sap.ui.layout.form"
xmlns:l="sap.ui.layout">
<Page title="How to change default value of datepicker in runtime on a fiori-App?">
<content>
<f:SimpleForm editable="true" width="75vw">
<f:content>
<Label text="From Date" />
<DatePicker id="idFromDate" />
<Label text="To Date" />
<DatePicker id="idToDate" navigate="handleToDateNavigate"/>
</f:content>
</f:SimpleForm>
</content>
</Page>
</sap.ui.core.mvc:View>