Skip to Content
0
Former Member
Aug 04, 2016 at 12:39 PM

How to use Controls of higher version UI5 in a lower version UI5 application

57 Views

Hi All,

I am trying to create a scenario in a dummy project where I am trying to load Generic tiles, ComparisonChart etc., of 1.34+ in 1.28.4. I tried the with steps provide in the How to Use Controls from a Newer UI5 Version in... | SCN but ended up with error

Uncaught Error: failed to load 'tilechartdemo/controls/GenericTile.js' from ./tilechartdemo/controls/GenericTile.js: Error: failed to load 'tilechartdemo/controls/TileContent.js' from ./tilechartdemo/controls/TileContent.js: TypeError: Cannot read property 'prototype' of undefined

Please find the details below :

PROJECT STRUCTURE

INDEX FILE

<!DOCTYPE HTML>
<html> 
<head> 
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="https://sapui5.netweaver.ondemand.com/1.28.4/resources/sap-ui-core.js"
            id="sap-ui-bootstrap"  
            data-sap-ui-libs="sap.m"  
            data-sap-ui-theme="sap_bluecrystal">
</script>  <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->  
<script>  
sap.ui.localResources("tilechartdemo"); 
var app = new sap.m.App({initialPage:"idmain1"}); 
var page = sap.ui.view({id:"idmain1", viewName:"tilechartdemo.main", type:sap.ui.core.mvc.ViewType.XML}); 
app.addPage(page); 
app.placeAt("content"); 
</script> 
</head> 
<body class="sapUiBody" role="application"> 
<div id="content"></div> 
</body>
</html>

MAIN.VIEW.XML

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:sap.ui.layout="sap.ui.layout"  controllerName="tilechartdemo.main" xmlns:cusControl="tilechartdemo.controls" xmlns:html="http://www.w3.org/1999/xhtml"> 
<Page title="Title">
 <content>   
<cusControl:GenericTile header="Total Cost" subheader="Cost by Plant" size="L" frameType="TwoByOne">    
   <layoutData>      
   <sap.ui.layout:GridData span="L6 M6 S12" spanXL="0" spanL="0" spanM="0" spanS="0" indentXL="0" indentL="0" indentM="0" indentS="0" spanLarge="0" spanMedium="0" spanSmall="0" indentLarge="0" indentMedium="0" indentSmall="0"></sap.ui.layout:GridData>      
 </layoutData>      
 <tileContent>   
       <cusControl:TileContent footer="TILE-CONTENT-FOOTER" size="M">        
       <content>          
         <cusControl:ComparisonMicroChart size="S" scale="M" isResponsive="true">          
             <cusControl:data>              
           <cusControl:ComparisonMicroChartData value="5.5" color="Good"></cusControl:ComparisonMicroChartData>                
          <cusControl:ComparisonMicroChartData value="2.5" color="Error"></cusControl:ComparisonMicroChartData>                         
 <cusControl:ComparisonMicroChartData value="4.5" color="Critical"></cusControl:ComparisonMicroChartData>              
         </cusControl:data>          
         </cusControl:ComparisonMicroChart>      
         </content>   
       </cusControl:TileContent>     
 </tileContent>  
</cusControl:GenericTile>  
 </content> 
</Page>
</core:View>

I am ending up with the below error.

Any idea why this error is thrown?

Thanks in advance.

Attachments

Error.PNG (16.3 kB)