Hi all,
I am trying to navigate to a view when pressing ObjectListItem.
The bellow image shows how the developed application looks like.
The idea is that if I click on "Crucial..." product, open at the right side the details view.
Bellow is a piece of code of the "CatalogMaster.view.xml" file:
-----CatalogMaster.view.xml------ <mvc:View xmlns:mvc="sap.ui.core.mvc" controllerName="com.sap.build.standard.productCatalog.controller.CatalogMaster" xmlns="sap.m"> <Page title="List Page Header" showHeader="true" showFooter="false" showNavButton="true" navButtonPress="_onPageNavButtonPress"> <content> <List mode="SingleSelectMaster" width="319px" headerText="Header" footerText="" backgroundDesign="Solid" showSeparators="All" growing="true" growingThreshold="20" growingScrollToLoad="true" visible="true"> <infoToolbar/> <headerToolbar> <Toolbar enabled="true" visible="true" width="" design="Solid"> <content> <SearchField placeholder="Search" showSearchButton="true" visible="true" width="100%"/> </content> </Toolbar> </headerToolbar> <items> <ObjectListItem intro="RAM Memory" title="Kingston 8GB DDR4" icon="sap-icon://database" number="79,76" numberUnit="USD" numberState="None" type="Active" selected="false" showMarkers="false" press="_onObjectListItemPress"> <attributes> <ObjectAttribute text="Supplier" active="false" visible="true"/> <ObjectAttribute text="Available in" active="false" visible="true"/> </attributes> <firstStatus> <ObjectStatus text="ABC Manufacturing Ltd." state="None" visible="true"/> </firstStatus> <secondStatus> <ObjectStatus text="7 Day(s)" state="None" visible="true"/> </secondStatus> </ObjectListItem> <ObjectListItem intro="RAM Memory" title="Crucial HU28973 4GB" icon="sap-icon://database" number="34,95" numberUnit="USD" numberState="None" type="Active" selected="false" showMarkers="false" press="onPress1"> <attributes> <ObjectAttribute text="Supplier" active="false" visible="true"/> <ObjectAttribute text="Available in" active="false" visible="true"/> </attributes> <firstStatus> <ObjectStatus text="EuroKing Ltd." state="None" visible="true"/> </firstStatus> <secondStatus> <ObjectStatus text="3 Day(s)" state="None" visible="true"/> </secondStatus> </ObjectListItem> ...more code goes here...
I defined the "onPress1" function on the CatalogMaster.controller.js file.
------CatalogMaster.controller.js ------ ...more code goes here... return new Promise(function (fnResolve) { this.doNavigate("CatalogDetail02", oBindingContext, fnResolve, ""); }.bind(this)).catch(function (err) { if (err !== undefined) { MessageBox.error(err.message); } }); }, onInit: function () { this.oRouter = sap.ui.core.UIComponent.getRouterFor(this); this.oRouter.getTarget("CatalogMaster").attachDisplay(jQuery.proxy(this.handleRouteMatched, this)); }, onPress1: function(oEvent) { var oRouter = sap.ui.core.UIComponent.getRouterFor(this); oRouter.navTo("CatalogDetail02"); } }); }, /* bExport= */ true);
Bellow is an image the file explorer of my project.
P.D.: I developed the interface of the app with SAP Build and then import on SAP Web IDE.
Regards,
Alvaro