UI5

Home / SAP / Archive by category "UI5" (Page 2)
Netweaver Gateway – Using Expand

Netweaver Gateway – Using Expand

I’ve recently started to move a new product onto UI5, and of course, that has open up new areas for me to explore.  The most recent was display the notification.  Initially, this sounded so easy.  Unfortunately, when you look at a document, there are many different tables associated with a single notification.

Header, items, tasks, etc.

I wrote my RFC to accept a single input of notification number, but the output consists of header and a bunch of tables.  Of course, for UI5, having a structured OData is far easier to work with, instead of doing a whole bunch of reads to the same RFC and tie them together myself.  Luckily, I found a great blog post that showed me the major things I needed to do:

http://scn.sap.com/community/gateway/blog/2014/07/18/implementing-expand-entityentity-set

Now, of course, this requires some work on the service side as well as in the coding.  So on the service side, you need to tie everything together with associations and navigation to connect the header to each of the individual tables.  Next, you go to the DPC_EXT class, and update the get_expanded_entityset method.  In this method, you need to build your structure.  You can make this as deep as you want, but this will make your service easier to use on the UI5 side.

Now, you can use the expand command within UI5 to say what pieces to pull out.  One thing I discovered while doing this, if you manually create each step of the association, my service had difficulties reading the expand.  So make sure you right click on Associations and select create.  This will walk you through 3 steps to make the connections.  For some reason when I manually built the pieces, my service couldn’t expand.  It might be my old version of the Gateway, but keep this in mind.

Thanks for reading,

UI5 – a nice way to Debug

UI5 – a nice way to Debug

The OpenSAP class has just shown me another neat little feature that I was unaware of.  In addition to debugging using Chrome or Firefox, there is another UI5 option to get a cleaner look at all of the stuff going on.  After you execute your application press the following keys:

<Control><Alt><Shift>s

it will bring up the following window.

blog-20160614-01

You can then click into any of the options to expand what you can see and do.

blog-20160614-02

I’ve finally got used to debugging in Chrome, but to me, it’s far from easy.  You can’t complete avoid Chrome because this page won’t be very useful if your app isn’t even rendering.  In that case, you will need to solve those issue first.  But if you find your app isn’t behaving like you expected, you can use this nice little tool to easily work through the elements to see what’s going on.

Thanks for reading,