Skip to Content
0
Former Member
Mar 04, 2014 at 07:06 AM

Not able to add pages in a split app using SAPUI5 framework on Eclipse Kepler

204 Views

Dear All,

I am doing some basic development on SAPUI5 framework using Eclipse Kepler.

Problem Statement:

In the below code, I am trying to create a Split App wherein I have Master pages and Detail pages.

But somehow after running the application on Apache server or Web App Preview in Eclipse,

the statement " alert(oSplitApp.addMasterPage(oMasterPage1).addMasterPage(oMasterPage2)); " did not execute and consequently I did not get the output !

Note:

I have added few alerts to track/debug the issue where i found that alert("3"); did not come as its is after the addMasterPage statement.

* Please review my code and share your views or experiences on the same.

Code:-

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"

data-sap-ui-theme="sap_bluecrystal">

</script>

<!-- only load the mobile lib "sap.m" and the "sap_mvi" theme -->

<script>

alert("0"); // This alert comes.. so we can move ahead ..

var oSplitApp = new sap.m.SplitApp("mySplitApp", {});

var oDetailPage1 = new sap.m.Page("detail1", {

title : "Detail 1",

content : [ new sap.m.Label({

text : "this is Detail 1"

}) ]

});

var oDetailPage2 = new sap.m.Page("detail2", {

title : "Detail 2",

content : [ new sap.m.Label({

text : "this is Detail 2"

})

]

});

var oMasterPage1 = new sap.m.Page("master1",{

title : "Master",

content : [ new sap.m.List({

items : [ new sap.m.StandardListItem({

title : "To Master 2",

type : "Navigation",

tap : function() {

oSplitApp.toMaster("master2");

}

})]

}) ]

});

var oMasterPage2 = new sap.m.Page("master2",{

title : "Master2",

navButtonTap : function() {oSplitApp.backMaster();},

content : [ new sap.m.List({

mode:"SingleSelectMaster",

select: function(oEv) {

if(oEv.getParameter("listItem").getId() == "listDetail2") {

oSplitApp.toDetail("detail2");

}

else {

oSplitApp.toDetail("detail1");

}

},

items : [ new sap.m.StandardListItem("listDetail2",{

title : "To Detail 2"

}),

new sap.m.StandardListItem("listDetail",{

title : "To Detail 1"

}) ]

}) ]

});

alert("2"); // alert 2 did appears , so great..

//add the master pages to the splitapp control

oSplitApp.addMasterPage(oMasterPage1).addMasterPage(oMasterPage2) ; /// This does not execute...

alert("3"); // alert 3 did not come . !!

//add the detail pages to the splitapp control

oSplitApp.addDetailPage(oDetailPage1).addDetailPage(oDetailPage2);

oSplitApp.setInitialDetail("detail1");

oSplitApp.setInitialMaster("master1");

oSplitApp.setDefaultTransitionNameDetail("fade");

oSplitApp.placeAt("content");

oSplitApp.setMode("PopoverMode");

</script>

</head>

<body class="sapUiBody" role="application">

<div id="content"></div>

</body>

</html>

.......

Thanks and Regards,

Anshul Arora