Breadcrumbs Error show SAPUI5

[Former Member]

Hi all,

I want to show breadcrumbs but failed. "the error is Uncaught Error: failed to load 'sap/uxap/Breadcrumbs.js' from resources/sap/uxap/Breadcrumbs.js: 404 - Not Found"

and if I use breadcrumbs from m library (sap.m) still show error. the error is "Cannot read property 'id' of undefined at constructor.R.attachListener (ResizeHandler-dbg.js:106)"

how to solve this problem?

Thanks.

mycode form1.view.xml:

<mvc:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc"
xmlns:sample="sap.uxap.sample.MPModelMapping" xmlns="sap.m" xmlns:t="sap.ui.table"
xmlns:l="sap.ui.layout" xmlns:tnt="sap.tnt" xmlns:ux="sap.uxap"
controllerName="csssapui5.form" xmlns:html="http://www.w3.org/1999/xhtml">
<!-- Header -->
<mvc:XMLView viewName="csssapui5.Header" id="headerView" />
<l:VerticalLayout
class="breadcrumbs breadcrumbs-items breadcrumbs-line-height" width="100%">
<l:content>
<Breadcrumbs >
<Link press="onPress" text="Products"/>
<Link press="onPress" text="Suppliers"/>
<Link press="onPress" text="Titanium"/>
<Link press="onPress" text="Ultra portable"/>
<Link press="onPress" text="12 inch"/>
<Link press="onPress" text="Super portable deluxe"/>
</Breadcrumbs>
</l:content>
</l:VerticalLayout>
<Panel id="panelModule" headerText="Header form">
<content>
<Label text="Ini form 1" />
</content>
</Panel>
<!-- Footer -->
<mvc:XMLView viewName="csssapui5.Footer" id="footerView" />
</mvc:View>

header:

<mvc:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m" xmlns:t="sap.ui.table" xmlns:l="sap.ui.layout" xmlns:tnt="sap.tnt"
controllerName="csssapui5.Header" xmlns:html="http://www.w3.org/1999/xhtml">
<tnt:ToolHeader id="idHeader">
<html:img src="icon/logo_taspen.png" />
<html:p>NEW APPLICATION CORE BUSINESS</html:p>
<ToolbarSpacer width="20px" />
<tnt:ToolHeaderUtilitySeparator />
<ToolbarSpacer>
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow"
minWidth="20px" />
</layoutData>
</ToolbarSpacer>
<Text text="Selasa, 21/4/2017 / 11:07 AM" />
<Text text="Hello, Jhon Doe">
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow" />
</layoutData>
</Text>
<Button icon="sap-icon://log" type="Reject" press="logoutPress"
class="button-logout button-logout-icon margin-logout">
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow" />
</layoutData>
</Button>
</tnt:ToolHeader>
</mvc:View>

footer:

<mvc:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m" xmlns:t="sap.ui.table" xmlns:l="sap.ui.layout" xmlns:tnt="sap.tnt"
controllerName="csssapui5.Footer" xmlns:html="http://www.w3.org/1999/xhtml">
<Page id="idFooterPage" showHeader="false">
<footer id="footer">
<OverflowToolbar id="otbFooter">
<Button type="Transparent" text="Kebijakan dan Privasi"
press="kebdanprivPress" />
<Button type="Transparent" text="Bantuan" press="bantuanPress" />
<ToolbarSpacer />
<Label text="All Rights Reserved PT. Taspen Persero" />
<Label text="2018" />
</OverflowToolbar>
</footer>
</Page>
</mvc:View>

[Ivan-Mirisola]

Hi Bobby,

In order to use the Breadcrumbs tag, you need to specify it as well like this:

<Breadcrumbs> //here it is all lowercase, except the first letter

Your bootstrapping like this:

<script src="/resources/sap-ui-core.js"
  id="sap-ui-bootstrap"                
  data-sap-ui-libs="sap.ui.commons, sap.m"
  data-sap-ui-theme="sap_bluecrystal"
>
</script>

Don't use sap.uxap components unless your are developing an Object Page based application. In such cases a Breadcrumb is going to represent the navigation inside the Object Page.

Therefore, please remove any unneeded xmlns declarations from your xml views.

If you need to see an "sap.m" working sample, please take a look here.

If you still have problems, please post your controller here or share the project via github so we can take a look, debug, etc..

Regards,
Ivan