cancel
Showing results for 
Search instead for 
Did you mean: 

DynamicSideContent - Unable to get property 'ShowAboveS' of undefined or null reference

0 Kudos

I have used a simple XML for a DynamicSideContent (and have even taken the sample XML file from the SAP UI5 Explored website) and deployed it to our SAP environment (sap.ui.version is 1.44.32).

I get the following error every time:

"Uncaught Error: failed to load 'sap/ui/layout/DynamicSideContent.js' from resources/sap/ui/layout/DynamicSideContent.js: TypeError: Cannot read property 'ShowAboveS' of undefined"

I have tried explicitly setting the sideContentVisibility to AlwaysShow in the XML. I can see from the SAPUI5 Diagnostics dialog pop-up that sap.ui.layout v1.44.32 is loaded.

Any suggestions how I fix it?

maheshpalavalli
Active Contributor
0 Kudos

It looks like that enum is available from 1.30 itself.. Can you paste the xml code and error log from the console..?

0 Kudos

XML Code is as per the sample in the SAPUI5 Explored website. Or see simpler snippet below

<l:DynamicSideContent
  id="DynamicSideContent"
  class="sapUiDSCExplored sapUiContentPadding"
  sideContentFallDown="BelowM"
  sideContentVisibility="ShowAboveM"
  containerQuery="false"
  breakpointChanged="updateToggleButtonState">
<l:mainContent>
  <Title level="H1" text="Titles" />
</l:mainContent>
<l:sideContent>
  <Text text="Test"></Text>
</l:sideContent>
</l:DynamicSideContent>
0 Kudos

Console error message:

Uncaught Error: failed to load 'sap/ui/layout/DynamicSideContent.js' from resources/sap/ui/layout/DynamicSideContent.js: TypeError: Cannot read property 'ShowAboveS' of undefined at s1 (https://fioridv.cpr.ca/sap/bc/ui5_ui5/sap/ztoolboxui5app/resources/sap-ui-core.js:174:7274) at Object.q.sap.require (https://fioridv.cpr.ca/sap/bc/ui5_ui5/sap/ztoolboxui5app/resources/sap-ui-core.js:174:11390) at

<... more stack trace here ...>

, <anonymous>:571:6214) at h (eval at evalModuleStr (https://fioridv.cpr.ca/sap/bc/ui5_ui5/sap/ztoolboxui5app/resources/sap-ui-core.js:174:7704), <anonymous>:571:2796) Caused by: TypeError: Cannot read property 'ShowAboveS' of undefined at eval (https://fioridv.cpr.ca/sap/bc/ui5_ui5/sap/ztoolboxui5app/resources/sap/ui/layout/DynamicSideContent.js?eval:6:487)

...

0 Kudos

The part of DynamicSideContent.js whilch is failing is "defaultValue: sap.ui.layout.SideContentVisibility.ShowAboveS" - see snippet below

sap.ui.define(['jquery.sap.global', 'sap/ui/core/Control', 'sap/ui/core/ResizeHandler'], function(q, C, R) {
    "use strict";
    var D = C.extend("sap.ui.layout.DynamicSideContent", {
        metadata: {
            library: "sap.ui.layout",
            properties: {
                showSideContent: {
                    type: "boolean",
                    group: "Appearance",
                    defaultValue: true
                },
                showMainContent: {
                    type: "boolean",
                    group: "Appearance",
                    defaultValue: true
                },
                sideContentVisibility: {
                    type: "sap.ui.layout.SideContentVisibility",
                    group: "Appearance",
                    defaultValue: sap.ui.layout.SideContentVisibility.ShowAboveS
                },
                sideContentFallDown: {
                    type: "sap.ui.layout.SideContentFallDown",
                    group: "Appearance",
                    defaultValue: sap.ui.layout.SideContentFallDown.OnMinimumWidth
                },
0 Kudos

Mahesh - yes, it does seem that the enum is somehow missing (or something)

maheshpalavalli
Active Contributor
0 Kudos

Better raise a bug to SAP about this.. I am not sure what might be the issue.. Can you also do one thing..? Go to diagnostics, in the debugging pannel, provide the custom boot url and check once

https://openui5.hana.ondemand.com/1.44.32/resources/sap-ui-core.js

BR,

Mahesh

0 Kudos

Mahesh - I did as you suggested in with the custom boot url. No change - same error as before. 😞

Accepted Solutions (0)

Answers (2)

Answers (2)

I got it working. The missing SideContentVisibility enum is in the sap ui layout library.js, which was not being loaded. After reading the following link:

sapui5 failed to load resource library, I went to the index.html and in the <script> tag and changed

data-sap-ui-libs="sap.m"

to

data-sap-ui-libs="sap.m, sap.ui.layout"

and then I could see the sap.ui.layout library with all the supporting classes get loaded, and the DynamicSideContent displayed correctly!

0 Kudos

This issue arises when js/jquery is not able to refer to the element. It is because at the time of rendering the page(view), object is null or undefined - which means that there is no instance of a class in the variable. If you are getting data for object from an async call(api's), these kind of problems will arise. So you should always check the object whether it is null or undefined then if it is not, you can access its properties.

The standard way to catch null and undefined simultaneously is this:

if (variable == null) 
{ // your code here. }

Because null == undefined is true, the above code will catch both null and undefined.

Also you can write equivalent to more explicit but less concise:

if (variable === undefined  variable === null) 
{ // your code here. }

This should work for any variable that is either undeclared or declared and explicitly set to null or undefined.

In most cases this error is related to getElementById(). So getting a value from an input could look like this:

var value = document.getElementById("frm_new_user_request").value

Also you can use some JavaScript framework, e.g. jQuery, which simplifies operations with DOM (Document Object Model) and also hides differences between various browsers from you.

Getting a value from an input using jQuery would look like this:

input with ID "element": var value = $("#element).value
input with class "element": var value = $(".element).value