hi sai,
index.html:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m,sap.ui.comp,sap.ui.layout,sap.ui.unified"
data-sap-ui-resourceroots='{"AssetPro": "./"}'
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
/* sap.ui.localResources("spinner");
var app = new sap.m.App({initialPage:"idView11"});
var page = sap.ui.view({id:"idView11", viewName:"spinner.ObjectHeader", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page);
app.placeAt("content"); */
sap.ui.getCore().attachInit(function() {
new sap.m.App ({
pages: [
new sap.m.Page({
title: "Asset Acquisition - Post Capitalization",
enableScrolling : true,
content: [ new sap.ui.core.ComponentContainer({
name : "AssetPro"
})]
})
]
}).placeAt("content");
});
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="https://sapui5.netweaver.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m,sap.ui.comp,sap.ui.layout"
data-sap-ui-theme="sap_bluecrystal">
</script>
only load the mobile lib "sap.m" and the "sap_bluecrystal" theme
<script src="resources/underscore.js">
</script>
<script>
sap.ui.localResources("assetpro");
var app = new sap.m.App({initialPage:"idTrial1"});
var page = sap.ui.view({id:"idTrial1", viewName:"assetpro.Trial", 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> -->
Component.js:
/*!
* SAP UI development toolkit for HTML5 (SAPUI5/OpenUI5)
* (c) Copyright 2009-2015 SAP SE or an SAP affiliate company.
* Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
*/
/**
* @fileOverview Application component to test bindings using OData types.
* @version @version@
*/
jQuery.sap.declare("AssetPro.Component");
jQuery.sap.require("sap.ui.model.odata.AnnotationHelper");
sap.ui.core.UIComponent.extend("AssetPro.assetpro.Component", {
createContent: function () {
// var oModel = new sap.ui.model.json.JSONModel();
var oModel = new sap.ui.model.json.JSONModel({
"ProductCollection": [
{
"ProductId": "1239102",
"Name": "Power Projector 4713",
"Category": "Projector",
"SupplierName": "Titanium",
"Description": "A very powerful projector with special features for Internet usability, USB",
"WeightMeasure": 1467,
"WeightUnit": "g",
"Price": 856.49,
"CurrencyCode": "EUR",
"Status": "Available",
"Quantity": 3,
"UoM": "PC",
"Width": 51,
"Depth": 42,
"Height": 18,
"DimUnit": "cm",
"ProductPicUrl": "https://sapui5.hana.ondemand.com/sdk/test-resources/sap/ui/demokit/explored/img/HT-6100.jpg"
},
{
"ProductId": "2212-121-828",
"Name": "Gladiator MX",
"Category": "Graphics Card",
"SupplierName": "Technocom",
"Description": "Gladiator MX: DDR2 RoHS 128MB Supporting 512MB Clock rate: 350 MHz Memory Clock: 533 MHz, Bus Type: PCI-Express, Memory Type: DDR2 Memory Bus: 32-bit Highlighted Features: DVI Out, TV Out , HDTV",
"WeightMeasure": 321,
"WeightUnit": "g",
"Price": 81.7,
"CurrencyCode": "EUR",
"Status": "Discontinued",
"Quantity": 10,
"UoM": "PC",
"Width": 34,
"Depth": 14,
"Height": 2,
"DimUnit": "cm",
"ProductPicUrl": "https://sapui5.hana.ondemand.com/sdk/test-resources/sap/ui/demokit/explored/img/HT-1071.jpg"
},
{
"ProductId": "K47322.1",
"Name": "Hurricane GX",
"Category": "Graphics Card",
"SupplierName": "Red Point Stores",
"Description": "Hurricane GX: DDR2 RoHS 512MB Supporting 1024MB Clock rate: 550 MHz Memory Clock: 933 MHz, Bus Type: PCI-Express, Memory Type: DDR2 Memory Bus: 64-bit Highlighted Features: DVI Out, TV-In, TV-Out, HDTV",
"WeightMeasure": 588,
"WeightUnit": "g",
"Price": 219,
"CurrencyCode": "EUR",
"Status": "Out of Stock",
"Quantity": 25,
"UoM": "PC",
"Width": 34,
"Depth": 14,
"Height": 2,
"DimUnit": "cm",
"ProductPicUrl": "https://sapui5.hana.ondemand.com/sdk/test-resources/sap/ui/demokit/explored/img/HT-1072.jpg"
},
{
"ProductId": "22134T",
"Name": "Webcam",
"Category": "Accessory",
"SupplierName": "Technocom",
"Description": "Web camera, color, High-Speed USB",
"WeightMeasure": 700,
"WeightUnit": "g",
"Price": 59,
"CurrencyCode": "EUR",
"Status": "Available",
"Quantity": 22,
"UoM": "PC",
"Width": 18,
"Depth": 19,
"Height": 21,
"DimUnit": "cm",
"ProductPicUrl": "https://sapui5.hana.ondemand.com/sdk/test-resources/sap/ui/demokit/explored/img/HT-1112.jpg"
},
{
"ProductId": "P1239823",
"Name": "Monitor Locking Cable",
"Category": "Accessory",
"SupplierName": "Technocom",
"Description": "Lock for Monitor",
"WeightMeasure": 40,
"WeightUnit": "g",
"Price": 13.49,
"CurrencyCode": "EUR",
"Status": "Available",
"Quantity": 30,
"UoM": "PC",
"Width": 11,
"Depth": 11,
"Height": 3,
"DimUnit": "cm",
"ProductPicUrl": "test-resources/sap/ui/demokit/explored/img/HT-1111.jpg"
},
{
"ProductId": "214-121-828",
"Name": "Laptop Case",
"Category": "Accessory",
"SupplierName": "Red Point Stores",
"Description": "Laptop Case with room for pencils and other items",
"WeightMeasure": 1289,
"WeightUnit": "g",
"Price": 78.99,
"CurrencyCode": "EUR",
"Status": "Discontinued",
"Quantity": 15,
"UoM": "PC",
"Width": 53,
"Depth": 34,
"Height": 7,
"DimUnit": "cm",
"ProductPicUrl": "test-resources/sap/ui/demokit/explored/img/HT-1114.jpg"
}]
});
// oModel.loadData("spinner/Model/products.json");
var oViewContainer = new sap.m.VBox();
console.log(oModel);
sap.ui.getCore().setModel(oModel);
var oViewTemplate = sap.ui.view({
preprocessors: {
xml: {
models: {
tmpl: oModel // we are assigning model to template with the name "tmpl"
}
}
},
type: sap.ui.core.mvc.ViewType.XML,
viewName: "AssetPro.assetpro.ObjectHeader" // path to xml template file.
});
oViewContainer.addItem(oViewTemplate);
return oViewContainer;
}
});