Skip to Content

Walkthrough Tutorial Questions - please use this thread for Q&A

Hello learners of SAPUI5,

please use this thread to ask questions on the contents of the SAPUI5/OpenUI5 walkthrough tutorial.

We will gladly follow up with you and explain more details.


PS: There are a lot of discussions in the blog post but it is really hard to track and follow up so please ask questions related to the walkthrough here instead of the blog announcement New SAPUI5 Walkthrough Tutorial

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

10 Answers

  • Oct 22, 2015 at 06:57 PM

    A lot of questions were raised around step 26+27 in SAP Web IDE.

    We tried to keep the tutorial independent from the development environment so Web IDE specific configuration is not fully described yet but we will change this soon to describe more details.

    What do i have to do to get Step 26+27 working in Web IDE?

    SAPUI5 SDK - Walkthrough Tutorial

    1) You will have to add a neo-app.json file by selecting the root folder > right click > new > Cloud Connectivity Configuration

    2) You will have to add a destination to your SAP Hana Cloud Cockpit. Please find the instructions here. Name the destination "northwind":

    How to use Northwind OData service with SAP Web IDE

    3) You will have to change the URL in the manifest.json file and in the localService/mockserver.js file to:

    "/destinations/northwind/V2/Northwind/Northwind.svc/"

    4) You will have to add the configuration for the destination to the neo-app.json file:

    {

          "path": "/destinations/northwind",

          "target": {

            "type": "destination",

            "name": "northwind"

          },

          "description": "Northwind OData Service"

        },

    Thats it, you should be ready to receive data from the real service now!

    Hope it works,

    Michael

    Add comment
    10|10000 characters needed characters exceeded

    • Referring to the original question. You will probably have to setup a proxy or use a web page like corsanywhere to make the real service work as there is probably no destination concept for the local web ide installation. As outlined by Gabriel, with mockdata the app runs fine.

  • Oct 23, 2015 at 07:19 AM

    Hi Michael,

    thanks for open up a thread.

    If I want to create this project on our Local WebIDE (Standalone HanaBox - not the cloud WEB IDE), there isn't a possibility to create a neo-app.json file.

    1. I would like to use the configuration for the destination inside of the manifest, but don't get it ready.

         Is this not possible?

         If it should work, could someone bring up a sample (also for loading local mock data). Would very helpful.

         Okay, could help myself. Found a very helpful sample for a local file inside of walkthrough 20!

    2. "Automatic instantiation":

         If we use the CDN path src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" should we on the last stable version. This version should automatically support the new automatic instantiation, shouldn't it?


    Thanks for your help!

    Dirk

    (Sorry, if this questions sound stupid, but I'm new in this area)




    Message was edited by: Dirk Raschke

    Add comment
    10|10000 characters needed characters exceeded

  • Oct 28, 2015 at 01:41 PM

    Q: Why does step 26 show no data in the cloud versions of openui5/sapui5.hana.ondemand.com?


    The example is not working on OpenUI5 and SAPUI5 as there is no proxy configured on these cloud-hosted installations for security reasons. Otherwise any website could proxy web pages through our cloud installation.

    The proxy concept is only used for local testing and if you download the SDK for local development (which uses the same code base, for example from openui5.org) then a proxy script is included in your local environment and the service call works.

    In a real environment you would add server-side configuration to be able to connect to specific backend system (google CORS for more details).

    Anyway, this step is a bit complicated to set up for certain environments, thats why you can just skip it and call the app with mock data instead. We just wanted to outline that for the application coding there is no difference between mock data and a real service call.


    Kind Regards,


    Michael

    Add comment
    10|10000 characters needed characters exceeded

  • Oct 29, 2015 at 03:50 AM

    Hello Michael,

    Want to report

    walk through Navigation and Routing demo is not found

    SAPUI5 Explored

    Thank you

    Add comment
    10|10000 characters needed characters exceeded

  • Dec 27, 2015 at 05:32 PM

    Hi Michael,

    I am not sure if this is the right place for this or not but i faced one issue which is stated in this thread .

    Can you guys please help?

    Regards,

    Ekansh

    Add comment
    10|10000 characters needed characters exceeded

    • Hi Michael,

      Thanks for your reply.

      I got this working with selectOnFocus=false . I wanted to know the reason behind re-rendering of my searchField. I got the correct answer on my thread that it is because my searchField is inside list so everytime i try something, it searches the items and thus list gets re-rendered. So my serachfield was also getting re-rendered. While in the SAPUI5 explored example, it is outside list so there was no issues as such.

      Anyways many thanks for your reply.

      Regards,

      Ekansh

  • avatar image
    Former Member
    Dec 30, 2015 at 12:42 AM

    Dear Michael Graf,

    I am unable to pass through Step20

    I am struggling for Hours on it.

    Followed the correct steps of adding Invoices.json

    Set the JSON model in Component.js

    Add new view for InvoiceList

    But Still I get "No Data"

    Tried to Debug in Ctrl_alt-Shift-S

    I get invalid Path..

    Can some one please help on this

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member Michael Graf

      Hello Michael,

      I am encountering the same issue and checking with the chrome tools i guess that browser is not even going to invoices file. I tried the SAP UI5 Diagnostic tool but being new to UI5 i am not able to get anything from that.

      Need help on this.

  • avatar image
    Former Member
    Dec 30, 2015 at 10:05 AM

    Hi Michael

    For all the steps,  I am using JS instead of XML. For step 21, I am stuck at a point where I cannot find how to write the code to pass different property values under the "number tag" using JS. Could you please guide ?

    Also, is there a possibility to enhance the documentation with JS sample coding for these examples, going further ?

    Thanks & Regards

    Srinivas Rao

    Add comment
    10|10000 characters needed characters exceeded

    • Hi Srinivas,

      all steps should also work with JS views but we do not recomment them as they do not clearly separate view and controller logic and they are hard to parse/read for tools and/or humans :-) In all recent documentation, we mostly show XML views and we won't show additional JS examples but you can easily translate them if you like.

      For step 21 you just have to remove the "" quotes as you can see here in this JSbin example:

      http://jsbin.com/somokilofe/edit?html,output

      Kind Regards,

      Michael

  • avatar image
    Former Member
    Mar 15, 2016 at 11:55 AM

    Hi Michael,

    You have any Video tutorial for UI5 walkthrough - where it is explained better / and in detail.

    If not consider to create Video based walkthrough - in which you can try to explain each steps in detail.

    Thanks for the UI5 walkthrough document.

    Add comment
    10|10000 characters needed characters exceeded

    • Hello Selvakumar,

      we have a bunch of videos in our OpenUI5 YouTube channel, it is not exactly the Walkthrough but good content anyway. Check it out here:

      OpenUI5 - YouTube

      And we are working on a new video course that will be announced in a few weeks. That will most likely what you are looking for. Watch out for an SCN announcement.

      Kind Regards,

      Michael

  • avatar image
    Former Member
    Mar 17, 2016 at 05:55 AM

    Hello Michael,

    I have just completed step 34- custom controls. Here, the rating for the first time works fine but as soon as we hit the "Rate" button it gets disabled for the rest of the list also. For example, Let's say we hit the first item from the list below.

    We are then directed to detail page and then we rate the product:

    Now, when we have rated the product, if we go back and click some other product the rating indicator remains in the same state.

    As per my understanding, in this example we cannot save the state of this indicator for a particular product to be retrieved later(since there is no backend system available to save) but can we reset it each time we navigate to detail page after clicking the product?

    I tried a couple of things but that didn't work. And in explored it says no data ( I am trying to comprehend with your above post regarding this ), so couldn't check there also.
    Please guide me through this.

    Thank You,
    Ashutosh Hans


    Add comment
    10|10000 characters needed characters exceeded

    • Hello Ashutosh,

      in our simple example, we did not bind the rating value to the model:


      <wt:ProductRating class="sapUiSmallMarginBeginEnd" change="onRatingChange"/>


      If we would have done so (which we intentionally did not because the northwind service does not have a rating property) the rating would be reset automatically when you switch the page.

      If 2-way binding is enabled and the service is writable then the rating would even be persisted on the backend. Otherwise a custom change handler could call a service in the backend.

      Hope that answers your question!

      Michael

  • Mar 28, 2016 at 10:17 AM

    Hello Michael

    I have started the Walkthrough tutorial and managed to pass steps 1 to 3 successfully.

    However in Step 4 (using a separate view page) I do not see the "Hello World" message although I used the original coding from the description. The SAPUI5 environment is loaded as I have verified by an alert message.

    I am using the SAP Web IDE development environment under https://webide-pxxxxxxxxxxtrial.dispatcher.hanatrial.ondemand.com/

    Maybe I still must change something on my Run Configuration?

    Can you please assist?

    Kind regards

    Christoph

    Add comment
    10|10000 characters needed characters exceeded