cancel
Showing results for 
Search instead for 
Did you mean: 

ObjectListItem press not working

former_member747416
Discoverer
0 Kudos

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

Accepted Solutions (0)

Answers (2)

Answers (2)

former_member747416
Discoverer
0 Kudos

Thanks for you quick reply.

saurabh.v I have already implemented the _onObjectListItemPress event handler in my controller, you can check on the image bellow.

----CatalogMaster.controller.js-----

Apart from this, I have tried to implement the piece of code bellow with a button, instead of a ObjectListItem object, and it works with a button, but not with the ObjectListItem.

----CatalogMaster.controller.js-----

Is there anything I missed to implement on any class?

Regards,

Alvaro

saurabh_v
Active Participant
0 Kudos

You should define the _onObjectListItemPress event handler in your controller, as this is what is assigned to the press event in your first ObjectListItem control, and implement your code for the navigation in this function. I don't think you can have separate event handlers for individual ObjectListItem controls within the List control.