Skip to content

Instantly share code, notes, and snippets.

@qmacro

qmacro/UI5RelativeDates.html

Last active May 8, 2016 14:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save qmacro/7c7bb3ce192769339cc9245f0de01c1c to your computer and use it in GitHub Desktop.
Save qmacro/7c7bb3ce192769339cc9245f0de01c1c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
UI5RelativeDates.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title>Relative Dates</title>
<script id="sap-ui-bootstrap"
type="text/javascript"
src="/ui5/latest/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.m"
data-sap-ui-xx-bindingSyntax="complex"
>
</script>
<script id="main" type="ui5/xmlview">
<mvc:View
controllerName="local.controller.main"
xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m">
<Input
width="50%"
enabled="false"
value="{
path : '/date',
type : 'sap.ui.model.type.Date'
}"
description="{
path : '/date',
type : 'sap.ui.model.type.Date',
formatOptions : {
style : 'medium',
relative : true,
relativeScale : 'auto'
}
}" />
<Slider
width="50%"
liveChange="onChange"
min="-400"
max="400" />
</mvc:View>
</script>
<script>
sap.ui.controller("local.controller.main", {
_oModel : null,
onInit : function(oEvent) {
this._oModel = new sap.ui.model.json.JSONModel({
date : new Date()
});
this.getView().setModel(this._oModel);
},
onChange : function(oEvent) {
var dDate = new Date();
dDate.setDate(dDate.getDate() + oEvent.getParameter("value"));
this._oModel.setProperty("/date", dDate);
}
});
var oView = sap.ui.xmlview({ viewContent: jQuery("#main").html() });
oView.placeAt('content');
</script>
</head>
<body class="sapUiBody" id="content" />
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment