Skip to Content
0

SAPUI5 custom component with HTML as resource

Mar 26 at 09:59 AM

53

avatar image

Hello,

Currently I'm diving into creating custom controls for SAPUI5 applications, as described in this excellent blog from Phillip Smith for example. What I notice is that each custom control has a renderer method in which its HTML code is build up with RenderManager methods like write for example.

But is it also possible to load the HTML from a project resource first and then apply attributes and processing based on RenderManager and Control attributes?

Usage case: transform HTML templates delivered by Design Team into SAPUI5 custom controls. I want to prevent transforming whole HTML documents to oRm.write function calls.

Thanks in advance!

Bram

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

avatar image
Former Member
May 10 at 09:01 AM
0

Hi Bram Keijers,

Is it SAPUI5 templates or some other 3rd party HTML content?

Control sap ui.core.HTML can be used to insert any HTML content into the SAPUI5 application.

JQuery load() function can then be used to load content into that sap.ui.core.HTML control.

Personally, I would rather create and use custom controls instead of the templates.

Show 1 Share
10 |10000 characters needed characters left characters exceeded

Hi Miklos,

It's 3rd party HTML content which we want to transform to SAPUI5 controls. I want to leave this content in an HTML file in the SAPUI5 App, and load this file from the custom control. In this way I want to prevent having to change oRM.write("<div>....</div>"); calls manually when something is updated . So basically there are two options:

1. attach the content to the container element of the custom control:

$(document).ready(function() {
      $(".controlContainer").load("controlHTML.html");
    });

2: use an ajax call:

$.ajax({
            url : "controlHTML.html",
            dataType: "html",
            success : function (data) {
                $(".controlContainer").html(data);
            }
        });

I'm going to test whether these work in SAPUI5.

Thanks for helping out!

Bram

1