Issues with extending the Fiori Approve PO App

[Former Member]

Dear experts

I am trying to extend the Approve PO App, however stuck with some issues. I have created an extension project using Eclipse from the parent project source code

I need to add few button in the footer of the Master view (which displays the List of Items) ..e.g.

  ( this is just for an example)

Now I got the source code, and I see there are two xml files - S2.view.xml    and the other S2.view.app.xml

1) Which of these is Master view?? How do I know

2) Nither of these xml views (S2 & S2.app) have any extension points for footer??? So, what is the bes way to add in this case?

3) I tried to add a footer in one of the views by modifying the original view itself ( S2.view.xml), but the changes do not reflect. Here is the code I added to the view

<footer>
            <Toolbar>
            <SegmentedButton selectedButton="small">
              <Button text="Small" id="small" />
              <Button text="Medium" />
              <Button text="Large" />
            </SegmentedButton>
        </Toolbar>
        </footer>

When I run the extended app in a local sandbox env, the footer is not displayed..

What could be the issues here? Any help is appreciated.

Thank you

Aakash

Tags edited by: Michael Appleby

[Former Member · Accepted solution]

In your EXTENSION Project you need to extend the S3 Controller and specifically extend the getHeaderFooterOptions like this:

Override this method and you can add Custom buttons. thanks Ashish

  this.oHeaderFooterOptions = {

            oPositiveAction: {

                sI18nBtnTxt: that.resourceBundle.getText("XBUT_APPROVE"),

                onBtnPressed: jQuery.proxy(that.handleApprove, that)

            },

            oNegativeAction: {

                sI18nBtnTxt: that.resourceBundle.getText("XBUT_REJECT"),

                onBtnPressed: jQuery.proxy(that.handleReject, that)

            },

     myNEWButton:{something....},

            buttonList: [{

                sId: "btn_Forward",

                sI18nBtnTxt: "XBUT_FORWARD",

                onBtnPressed: jQuery.proxy(this.handleForward, that)

            }],

            onBack: jQuery.proxy(function() {

                //Check if a navigation to master is the previous entry in the history

                var sDir = sap.ui.core.routing.History.getInstance().getDirection(this.oRouter.getURL("master"));

                if (sDir === "Backwards") {

                    window.history.go(-1);

                } else {

                    //we came from somewhere else - create the master view

                    this.oRouter.navTo("master");

                }

            }, this)

        };

        this.setHeaderFooterOptions(this.oHeaderFooterOptions);

    },

[Former Member · Accepted solution]

Hi Ashish

Thanks for your help.

I am confused, to add a Footer to Master view - I will have to change S3???? and that too a Controller??

Are we not supposed to add them in the view of S2..

Also which view represents Master , is it S2 or S2.view.app

Is there a help link, guide where all these caveats are mentioned??

Appreciate your help.

Thank you

Aakash

[Former Member · Accepted solution]

I would suggest to pls go through the documents published @ link below to understand Anatomy of a Fiori App.

S2 is left Hand Master View and S3 is Detail View and has Footer with the buttons that you are trying to change therefore you need to enhance the S3 Controller for the S3 View. Please go through some of the docs published above to help get an idea of how to extend an App.

thanks

A

[Former Member · Accepted solution]

Thanks Ashish

Well, I need to add the button in the left hand Master view only./...so it has to be either S2 or S2.app view..How do I know which one is it

I looked at the code for both the views, it looks similar

Another thing which is confusing - now to add the footer option - why do I have to change the controller?? shouldnt the UI elements be added in the view??

Thanks

Aakash

[Former Member · Accepted solution]

You would need to create an extension of s2 View and then add the buttons there with the logic to control the buttons in the s2.controller.js. Yes UI elements need to be added in the view but to control the logic of rendering/functionality in the buttons i.e onPress do something ...etc should be in the controller. pls go through the MVC paradigm in openui5.sap.com or search for openUI5/sapui5 in google to get an idea on MVC paradigm which talks about what is Model ,View and Controller.

Pls check if you can extend S2 view for this app and then see what options are available.

thanks

A

[Former Member · Accepted solution]

I am aware of MVC paradigm, how it is used in UI5..normally the UI element is defined in view and the event handler in controller...You are not reading the question i posted before...

However for this fiori app, even though I defined the buttons in the view, they do not appear..

This is what is confusing..Why do I have to add the Heade/Footer thru the controller???