Skip to Content

Data Binding in SAPUI5

Hi All

Here’s a tutorial I’ve written on Data Binding in SAPUI5.  This content will be integrated into the standard relase as one of the online tutorial when SAPUI5 1.30 is released later this year.

In the meantime, you can access this content as a stand-alone tutorial with an accompanying ZIP file containing the solutions.

SAPUI5 Data Binding Tutorial Document (Links to PDF document)

Solutions for Data Binding Tutorial Exercises (ZIP file)

This tutorial uses the Web IDE as the development environment and covers JSON models and Resource Bundles.


Chris W

You must be Logged on to comment or reply to a post.
  • Hi Chris,

    Within your data binding example you explain the use of the "revealing module" pattern in JavaScript for declaring controller objects.

    I notice that in the tutorial code provided by SAP (official) for data binding (and others) they have skipped this and just return an object with all methods declared inline.

    Have you any idea why they have done this? Are the issues with the "this" pointer resolved by other means now maybe?

    Regardless of this issues which can be resolved with bind() for example; the flaw in *not* using the revealing module pattern is that methods within the returned object cannot call other methods in the same object...


    • Hi Jason

      Yes, I used the revealing pattern because at the time I was developing the exercises, I needed two functions in the returned object to be able to reference each other.

      However, the document published in this blog was altered before being turned into the official training material because the coding example was altered.

      Yes, you can certainly get around the problem by using .bind(), but to me that is an example of where the developer must consciously add code that works around an ambiguity in the language (that ambiguity being JavaScript's flexibility of the meaning of this).

      To me, its a much more fault-tolerant style of coding to have a function return an object whose methods reference a closure (a.k.a. the revealing pattern).  That way, you avoid making the assumption that the developer consuming your object will just "know" that a bind() first needs to be performed.  (In the back of my mind here is Tony Hoare's comment that if the complexities of a programming language add to the complexity of the problem you're solving, then you're either using the wrong language, or your using the language wrong)

      As I understand it however, when you use the .extend() method inside sap.ui.define() to create your own controller or application etc., dependant objects should be created within same context as the object being defined, thus they should share a common definition of this.


      Chris W

      • I agree with you Chris. It's a shame SAP chose to drop the revealing module pattern in all of its new tutorials. The extend() function does solve the 'this' issue but you can't call other methods within your module, which is an issue for all but the simplest modules and one that is quite difficult to debug.

        When creating formatter modules or similar that don't extend a standard control you'll have the "this" issue again as well.  😉

  • Hi Chris

    This is awesome document.  This document says, there would be another document for OData , however I could not locate it . Can you please help ?


    Best Regards