Skip to Content

Greetings!!!

Yet another article to build List Report (SAP FIORI ELEMENT) .

Prerequisites: Make the below destination in hanatrial.


 

  1. Make a new Project from Template. Select “List Report Application“.



  2. Mention Project Name, Title, Namespace, Description”.



  3. Bind Northwind Data from “Service URL”. Click on Test to see if your data is coming properly.



  4. Leave Annotation Selection section blank.



  5. Mention below details in Template Customization.



  6. Click on Finish.

  7. Your application structure should be coming up as below.



  8. Make “annotations” folder in webapp.



  9. Right Click on “annotations” folder and Create “Annotation File”



  10. Select Annotation File from the dialog box



  11. Click on Next, then Finish.

  12. Application tree structure should be as below.



  13. Run the application with  flpSandbox.html



  14. Your application will come as tile, with Title and Description as given in Point 3.



  15. Click on Tile and screen will look as below.



  16. Click on Settings  and select few fields to be displayed as Columns. After clicking on Ok, screen will look as below. Note the difference between screen in Point 16 and Point 17.



  17. Click on Go. And this is how data will look like.



  18. Now why we created annotation file. We haven’t implemented any changes there. Click on “annotationsN.xml”, open it in “Annotation Modeler”. Add the following annotations.



  19. Run the application with  flpSandbox.html. Open tile, and you will notice the columns are coming up. You don’t have to select from “Settings”. Moreover, there are filters in “Filter Bar”



  20. Click on Go, and data is displayed. Select the filters to narrow down the result set.



 

That’s All Folks.

 

Feel free to revert, in case any doubts.

Valuable Suggestions and Feedback is welcome.

 

Thanks and Regards

Kiran Israni

To report this post you need to login first.

2 Comments

You must be Logged on to comment or reply to a post.

  1. Jocelyn Dart

    Hi Kiran

    Nice step by step example. We have a lot more in the Fiori elements wiki https://wiki.scn.sap.com/wiki/display/Fiori/Fiori+elements

    I can also add your blog there if you wish?

    Rgds

    Jocelyn

    (0) 

Leave a Reply