Hi Expert
we have develop sap ui5 application.
give following error, also application work fine in web ide but gives error on fiori lauch pad
Error: DOM element with ID 'content' not found in page, but application tries to insert content.
this is code
index.html
----------------------------------------------
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title>zrs_dtls</title>
<script id="sap-ui-bootstrap"
src="resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-libs="sap.m,sap.ui.commons,sap.m,sap.ui.commons"
data-sap-ui-resourceroots='{"mainpage": "./"}'>
</script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script>
sap.ui.getCore().attachInit(function() {
new sap.m.Shell({
app: new sap.ui.core.ComponentContainer({
height : "100%",
name : "mainpage"
})
}).placeAt("content");
});
oShell.addContent(sap.ui.getCore().byId("idtestView1"));
</script>
</head>
<body class="sapUiBody" id="content">
<div id="content">
</div>
</body>
</html>
------------------------------------------------------------------------------------------------------
master view.xml
<mvc:View xmlns:core="sap.ui.core" xmlns:footerbar="sap.ushell.ui.footerbar" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" controllerName="mainpage.view.Master">
<Page id="masterPage" title="{i18n>masterTitle}">
<subHeader id="masterSubHeader">
<Bar id="searchBar">
<contentMiddle>
<DatePicker change="handleChange" class="sapUiSmallMarginBottom" id="DP4" value="{path:'/dateValue', type:'sap.ui.model.type.Date', formatOptions: { pattern: 'yyyy-MM-dd\'T\'HH:mm:ss', UTC: false, source: { pattern: 'HH:mm:ss' } } }"/>
</contentMiddle>
</Bar>
</subHeader>
<content>
<Label text="Label" width="100%" id="lblcount"/>
<Text text="No text specified" maxLines="0" id="text2"/>
</content>
<footer id="masterFooter"/>
</Page>
</mvc:View>
-------------------------------------------------
master.controller.js
sap.ui.core.mvc.Controller.extend("mainpage.view.Master", {
onInit: function() {
// this.oInitialLoadFinishedDeferred = jQuery.Deferred();
// var oEventBus = this.getEventBus();
// oEventBus.subscribe("Detail", "TabChanged", this.onDetailTabChanged, this);
// var oList = this.getView().byId("list");
// oList.attachEvent("updateFinished", function() {
// this.oInitialLoadFinishedDeferred.resolve();
// oEventBus.publish("Master", "InitialLoadFinished");
// }, this);
//On phone devices, there is nothing to select from the list. There is no need to attach events.
// if (sap.ui.Device.system.phone) {
// return;
// }
// this.getRouter().attachRoutePatternMatched(this.onRouteMatched, this);
// oEventBus.subscribe("Detail", "Changed", this.onDetailChanged, this);
// oEventBus.subscribe("Detail", "NotFound", this.onNotFound, this);
},
handleChange: function(oEvent) {
var sValue = oEvent.getParameter("value");
var url = "/sap/opu/odata/sap/ZFICOUNTOLD_SRV/";
var oModel = new sap.ui.model.odata.ODataModel(url, true);
var aFilters = [];
var oFilters = new sap.ui.model.Filter("S_Date", sap.ui.model.FilterOperator.EQ, sValue);
aFilters.push(oFilters);
sap.ui.getCore().setModel(oModel);
// var txtcount = new sap.ui.commons.TextField();
// txtcount.setModel(oModel);
// txtcount.setValue(oModel.getData(sPath, [oContext], [bIncludeExpandEntries]))
// txtcount.placeAt("content");
// var oTextField = new sap.ui.commons.TextField(this.createId("text3"),
// { value:"{/CountSet/0/Item}"});
var variable1 = oModel.getProperty("/Mandt");
var variable11 = oModel.getProperty("/Item");
var variable111 = oModel.getProperty("/S_Date");
// oTextField.placeAt("content");
debugger;
var oTable = new sap.m.Table({
mode: sap.m.ListMode.None,
columns: [
new sap.m.Column({
width: "1em",
header: new sap.m.Label({
text: "Item Count"
})
})
]
});
var template = new sap.m.ColumnListItem({
id: "first_template",
type: "Navigation",
visible: true,
selected: true,
cells: [
new sap.m.Label({
id: "test1",
text: "{Item}"
})
]
});
oTable.bindItems("/CountSet", template, null, oFilters);
//this.getView().byId("lblCount").bindElement(sPath, [mParameters])
oTable.placeAt("content");
//return oTable;
//var label1 = template.getCells(1).valueOf("test1");
// var selectionCheck = oTable.getSelectedItem(0);
// var selectedRow = selectionCheck.mAggregations.cells[0];
// var selectedUserName = selectedRow["test1"];
// var data = oTable.getModel("oModel").getProperty(
// "oContext])
debugger;
//label1 = oModel.get
},
onRouteMatched: function(oEvent) {
// var sName = oEvent.getParameter(" name ");
// if (sName !== " main ") {
// return;
// }
// //Load the detail view in desktop
// this.loadDetailView();
// //Wait for the list to be loaded once
// this.waitForInitialListLoading(function () {
// //On the empty hash select the first item
// //this.selectFirstItem();
// });
},
onDetailChanged: function(sChanel, sEvent, oData) {
// var sEntityPath = oData.sEntityPath;
// //Wait for the list to be loaded once
// this.waitForInitialListLoading(function () {
// var oList = this.getView().byId(" list ");
// var oSelectedItem = oList.getSelectedItem();
// // The correct item is already selected
// if(oSelectedItem && oSelectedItem.getBindingContext().getPath() === sEntityPath) {
// return;
// }
// var aItems = oList.getItems();
// for (var i = 0; i < aItems.length; i++) {
// if (aItems[i].getBindingContext().getPath() === sEntityPath) {
// oList.setSelectedItem(aItems[i], true);
// break;
// }
// }
// });
// },
// onDetailTabChanged : function (sChanel, sEvent, oData) {
// this.sTab = oData.sTabKey;
// },
// loadDetailView : function(){
// this.getRouter().myNavToWithoutHash({
// currentView : this.getView(),
// targetViewName : "
// mainpage.view.Detail ",
// targetViewType : "
// XML "
// });
},
waitForInitialListLoading: function(fnToExecute) {
// jQuery.when(this.oInitialLoadFinishedDeferred).then(jQuery.proxy(fnToExecute, this));
},
onNotFound: function() {
// this.getView().byId(" list ").removeSelections();
},
selectFirstItem: function() {
// var oList = this.getView().byId(" list ");
// var aItems = oList.getItems();
// if (aItems.length) {
// oList.setSelectedItem(aItems[0], true);
// //Load the detail view in desktop
// this.loadDetailView();
// oList.fireSelect({"
// listItem " : aItems[0]});
// }
// else {
// this.getRouter().myNavToWithoutHash({
// currentView : this.getView(),
// targetViewName : "
// mainpage.view.NotFound ",
// targetViewType : "
// XML "
// });
// }
},
onSearch: function() {
// this.oInitialLoadFinishedDeferred = jQuery.Deferred();
// // Add search filter
// var filters = [];
// var searchString = this.getView().byId(" searchField ").getValue();
// if (searchString && searchString.length > 0) {
// filters = [ new sap.ui.model.Filter(" ", sap.ui.model.FilterOperator.Contains, searchString) ];
// }
// // Update list binding
// this.getView().byId("list ").getBinding("items ").filter(filters);
// //On phone devices, there is nothing to select from the list
// if (sap.ui.Device.system.phone) {
// return;
// }
// //Wait for the list to be reloaded
// this.waitForInitialListLoading(function () {
// //On the empty hash select the first item
// this.selectFirstItem();
// });
},
onSelect: function(oEvent) {
// Get the list item either from the listItem parameter or from the event's
// source itself (will depend on the device-dependent mode)
// this.showDetail(oEvent.getParameter("listItem ") || oEvent.getSource());
},
showDetail: function(oItem) {
// // If we're on a phone device, include nav in history
// var bReplace = jQuery.device.is.phone ? false : true;
// this.getRouter().navTo("
// detail ", {
// from: "
// master ",
// entity: oItem.getBindingContext().getPath().substr(1),
// tab: this.sTab
// }, bReplace);
},
getEventBus: function() {
// return sap.ui.getCore().getEventBus();
},
getRouter: function() {
// return sap.ui.core.UIComponent.getRouterFor(this);
},
onExit: function(oEvent) {
// var oEventBus = this.getEventBus();
// oEventBus.unsubscribe("
// Detail ", "
// TabChanged ", this.onDetailTabChanged, this);
// oEventBus.unsubscribe("
// Detail ", "
// Changed ", this.onDetailChanged, this);
// oEventBus.unsubscribe("
// Detail ", "
// NotFound ", this.onNotFound, this);
}
});
------------------------------------------
