SAPUI5 example

by amindunited

HTML

<!-- include the UI5 Library -->
<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m"></script>


<!--
  This is The View template
  (it will be referenced by it's id)
-->
<script id="myView" type="sapui5/xmlview">
	<mvc:View
        controllerName="local.controller"
        xmlns:mvc="sap.ui.core.mvc"
        xmlns="sap.m">
          <Button
            text="Hello UI5 World"
            press="doSomething" />
  </mvc:View> 
</script>

<div id='content'></div>

JavaScript

/* declare a controller
 *
 * @param string controller name
 * @param object the controller's functions
 */
sap.ui.controller("local.controller", {

  doSomething: function() {
    alert('Check the console.log!');
    console.log('========================================');
    console.log('Below is the window.sap object');
    console.log(window.sap);
  }

});

/* Register a view
 *
 * @param object the lifecycle functions of the view
 */
var oView = sap.ui.xmlview({
  viewContent: jQuery('#myView').html()
});

 /* Attach / Render a view
  * 
  * placeAt(id) accepts the id of the parent HTML element
  */
oView.placeAt('content');